/* GraphStream. Concept : le graphique du flux. Chaque rubrique a sa couleur franche, en aplat.
   Audace concentrée dans le graphique plein écran de l'accueil et les bandeaux de rubrique. Pas de dégradé. */
:root{--ink:#10131f;--mute:#555b6e;--line:#dfe1e8;--paper:#fff;--wash:#f3f4f7;--brand:#1a2bd8;--r-c:var(--brand);--r-t:#fff;
--disp:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;--ui:"Instrument Sans",ui-sans-serif,system-ui,sans-serif;--txt:"Newsreader",Georgia,serif}
.r-voyage{--r-c:#0a7ea4;--r-t:#fff}.r-tech{--r-c:#1a2bd8;--r-t:#fff}.r-maison-jardin{--r-c:#2c7a3f;--r-t:#fff}.r-auto-moto{--r-c:#c6281c;--r-t:#fff}
.r-cuisine{--r-c:#e8590c;--r-t:#10131f}.r-culture-loisirs{--r-c:#7a2bbf;--r-t:#fff}.r-mode-beaute{--r-c:#d6246e;--r-t:#fff}.r-sport{--r-c:#f2b705;--r-t:#10131f}
.r-famille{--r-c:#12a594;--r-t:#10131f}.r-business{--r-c:#10131f;--r-t:#fff}.r-animaux{--r-c:#9c5b1f;--r-t:#fff}.r-societe{--r-c:#47506b;--r-t:#fff}
.r-immobilier{--r-c:#0f5e6e;--r-t:#fff}.r-argent{--r-c:#0d7d5f;--r-t:#fff}.r-sante{--r-c:#c2185b;--r-t:#fff}.r-jeux{--r-c:#5b21b6;--r-t:#fff}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.5 var(--ui)}
img{max-width:100%;height:auto;display:block}a{color:inherit}
.w{width:100%;max-width:1440px;margin-inline:auto;padding-inline:max(16px,3vw)}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 12px;z-index:10}.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px}

/* en-tête */
.top{background:var(--brand);color:#fff;position:sticky;top:0;z-index:5}
.top-in{display:flex;align-items:center;gap:clamp(16px,3vw,40px);min-height:64px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:inherit;flex:none}
.logo svg{fill:currentColor}.logo b{font:800 1.45rem/1 var(--disp);letter-spacing:-.02em}
.menu{display:flex;gap:4px 18px;overflow-x:auto;scrollbar-width:none;font-weight:600;font-size:.95rem;white-space:nowrap;padding-block:6px}
.menu::-webkit-scrollbar{display:none}
.menu a{text-decoration:none;padding:6px 0;border-bottom:3px solid transparent}.menu a:hover{border-color:#fff}
.top :focus-visible{outline-color:#fff}

/* le graphique du flux */
.flux{background:var(--brand);color:#fff;padding-top:clamp(20px,4vw,48px)}
.flux h1{font:800 clamp(2.5rem,7.4vw,6.6rem)/.95 var(--disp);letter-spacing:-.035em;margin:0;max-width:16ch;text-wrap:balance}
.flux-s{margin:16px 0 clamp(20px,3vw,32px);max-width:60ch;font-size:1.05rem;color:#fff}
.flux-g{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:clamp(4px,.8vw,12px);height:clamp(220px,32vw,420px);align-items:end;padding-bottom:0}
.bar{position:relative;display:flex;flex-direction:column;justify-content:flex-end;height:100%;text-decoration:none;color:#fff;min-width:0}
.bar-f{display:block;height:calc(var(--h) - 34px);background:var(--r-c);border:2px solid #fff;border-bottom:0;transition:height .18s ease}
.bar:hover .bar-f{height:calc(var(--h) - 22px)}
.bar-n{font:800 clamp(1rem,1.8vw,1.6rem)/1 var(--disp);margin-bottom:6px;font-variant-numeric:tabular-nums}
.bar-t{position:absolute;left:8px;right:6px;bottom:10px;font:700 clamp(.72rem,1.05vw,1rem)/1.15 var(--ui);color:var(--r-t);overflow-wrap:anywhere}
@media (prefers-reduced-motion:reduce){.bar-f{transition:none}}

/* cartes */
.c{min-width:0}.c-l{display:flex;flex-direction:column;gap:8px;text-decoration:none;height:100%}
.c-i{display:block;aspect-ratio:16/10;background:var(--r-c);overflow:hidden}.c-i img{width:100%;height:100%;object-fit:cover}
.c-r{font-weight:700;font-size:.82rem;color:var(--r-c)}.r-cuisine .c-r,.r-sport .c-r,.r-famille .c-r{color:var(--ink)}
.c-t{font:700 1.14rem/1.2 var(--disp);letter-spacing:-.01em;text-wrap:pretty}
.c-l:hover .c-t{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px}
.g4{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr));gap:clamp(20px,2.4vw,32px) clamp(16px,2vw,28px)}

/* à la une */
.une{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(20px,3vw,44px);padding-block:clamp(24px,4vw,56px)}
.c-une .c-t{font-size:clamp(1.7rem,3.4vw,3.1rem);line-height:1.04;letter-spacing:-.025em}
.une-l{display:grid;gap:18px;align-content:start}
.c-h .c-l{display:grid;grid-template-columns:minmax(0,130px) minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:14px;row-gap:4px}
.c-h .c-i{grid-row:1/3}.c-h .c-t{font-size:1.1rem}

/* blocs par rubrique */
.bloc{padding-block:clamp(24px,3.4vw,44px);border-top:6px solid var(--r-c)}
.bloc-t{font:800 clamp(1.5rem,2.8vw,2.3rem)/1.05 var(--disp);letter-spacing:-.02em;margin:0 0 20px}.bloc-t a{text-decoration:none}.bloc-t a:hover{text-decoration:underline}

/* rubrique */
.rub-h{background:var(--r-c);color:var(--r-t);padding-block:clamp(22px,4vw,52px)}
.rub-h h1{font:800 clamp(2.3rem,6.4vw,5.4rem)/.98 var(--disp);letter-spacing:-.03em;margin:6px 0 10px;text-wrap:balance}
.rub-h p{margin:0;font-size:1.05rem}
.ar{font-size:.9rem;font-weight:600}.ar a{text-underline-offset:3px}
.subs{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0}
.subs a{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border:2px solid currentColor;text-decoration:none;font-weight:600;font-size:.92rem}
.subs a:hover{background:var(--r-t);color:var(--r-c)}
.liste{padding-block:clamp(24px,3.4vw,48px)}.vide{font-size:1.1rem}
.pag{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;margin-top:32px;font-weight:600}.pag a{min-height:44px;display:inline-flex;align-items:center}

/* article */
.art-h{background:var(--r-c);color:var(--r-t);padding-block:clamp(20px,3.4vw,44px)}
.art-hg{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(20px,3vw,48px);align-items:center}
.art-h h1{font:800 clamp(2rem,4.3vw,3.9rem)/1.02 var(--disp);letter-spacing:-.028em;margin:10px 0 14px;text-wrap:balance}
.art-m{margin:0;font-size:.98rem}.art-m a{font-weight:600}
.art-i{margin:0}.art-i img{width:100%;aspect-ratio:16/10;object-fit:cover}
.art-c{padding-block:clamp(24px,3.6vw,48px)}
.prose{max-width:720px;margin-inline:auto;font:400 1.22rem/1.62 var(--txt);overflow-wrap:break-word}
.prose h2{font:800 clamp(1.5rem,2.6vw,2rem)/1.14 var(--disp);letter-spacing:-.018em;margin:1.7em 0 .5em;text-wrap:balance}
.prose h3{font:700 1.3rem/1.2 var(--disp);margin:1.5em 0 .4em}.prose h4{font:700 1.08rem/1.3 var(--ui);margin:1.3em 0 .3em}
.prose p{margin:0 0 1em}.prose ul,.prose ol{margin:0 0 1.1em;padding-left:1.25em}.prose li{margin-bottom:.35em}
.prose a{color:var(--r-c);text-underline-offset:3px;font-weight:500}.r-cuisine .prose a,.r-sport .prose a,.r-famille .prose a{color:var(--ink)}
.prose img{margin:1.2em auto;height:auto}.prose figure{margin:1.2em 0}.prose figcaption{font:400 .9rem/1.4 var(--ui);color:var(--mute);margin-top:6px}
.prose blockquote{margin:1.2em 0;padding:.2em 0 .2em 1em;border-left:5px solid var(--r-c);font-style:italic}
.prose table{display:block;overflow-x:auto;border-collapse:collapse;width:100%;margin:1.2em 0;font:400 .95rem/1.4 var(--ui)}
.prose th,.prose td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}.prose th{background:var(--wash);font-weight:700}
.prose .pag-summary-box{background:var(--wash);border-left:6px solid var(--r-c);padding:16px 20px;margin:0 0 1.4em;font:400 1.02rem/1.5 var(--ui)}
.prose .pag-summary-title{font:800 1.15rem/1.2 var(--disp);margin-bottom:8px}
.bio{max-width:720px;margin:40px auto 0;display:grid;grid-template-columns:96px minmax(0,1fr);gap:18px;padding-top:24px;border-top:3px solid var(--ink);font-size:.98rem}
.bio img{width:96px;height:96px;object-fit:cover}.bio p{margin:0 0 6px}.bio-n{font:800 1.2rem/1.2 var(--disp)}.bio-r{color:var(--mute);font-weight:600;font-size:.92rem}

/* pages */
.page{padding-block:clamp(28px,4vw,56px)}.page h1{font:800 clamp(2.2rem,5vw,4rem)/1 var(--disp);letter-spacing:-.03em;margin:0 0 20px}
.prose-w h1,.prose-w .prose{max-width:720px;margin-inline:auto}.prose-w h1{margin-bottom:20px}
.mail{font:700 1.3rem/1.3 var(--ui);user-select:all}
.au{display:grid;grid-template-columns:160px minmax(0,1fr);gap:28px;max-width:960px}.au img{width:160px;height:160px;object-fit:cover}

/* pied */
.bas{background:var(--ink);color:#fff;margin-top:clamp(24px,4vw,56px);padding-block:clamp(28px,4vw,48px) 18px}
.bas-g{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1.2fr) minmax(0,.8fr);gap:28px}
.bas h2{font:700 1rem/1.2 var(--ui);margin:0 0 10px}.bas nav a{display:block;padding:5px 0;text-decoration:none;font-size:.95rem}.bas nav a:hover{text-decoration:underline}
.bas p{max-width:44ch;font-size:.95rem}.bas-c{font-size:.85rem;margin-top:20px}.bas :focus-visible{outline-color:#fff}

@media (max-width:980px){
 .une,.art-hg{grid-template-columns:minmax(0,1fr)}
 .bas-g{grid-template-columns:minmax(0,1fr)}
 .flux-g{grid-auto-flow:row;grid-template-columns:minmax(0,1fr);grid-auto-rows:44px;height:auto;gap:6px;padding-bottom:16px}
 .bar{flex-direction:row-reverse;justify-content:flex-end;align-items:center;gap:8px;height:44px}
 .bar-f{height:100%;width:calc((100% - 44px) * var(--p));border:2px solid #fff;flex:none;min-width:0}.bar:hover .bar-f{height:100%}
 .bar-n{margin:0 0 0 4px;flex:none;min-width:2ch}
 .bar-t{left:8px;right:auto;top:50%;bottom:auto;transform:translateY(-50%);max-width:70%;white-space:nowrap;font-size:.86rem}
}
@media (max-width:600px){
 .top-in{flex-wrap:wrap;gap:0 16px;padding-block:8px}.menu{width:100%}
 .au{grid-template-columns:minmax(0,1fr)}.bio{grid-template-columns:64px minmax(0,1fr)}.bio img{width:64px;height:64px}
 .top{position:static}
 .prose{font-size:1.14rem}
}