/*
Theme Name: Guinée 28 Info
Theme URI: https://guinee28.info/
Author: CONFORDEV
Description: Thème de presse sur mesure pour Guinée 28 Info : une, fil de l'actualité, blocs rubriques, météo, convertisseur de devises, publicités, newsletter, abonnement, Guinée 28 TV, mode sombre. Optimisé mobile, Core Web Vitals et référencement Google (NewsArticle, sitemap Google News), compatible Rank Math et WP Super Cache.
Version: 1.1.1
Requires at least: 6.3
Tested up to: 6.8
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: guinee28
Tags: news, blog, two-columns, right-sidebar, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

/* Layout : reprise fidèle de civinewsguinee.info — en-tête clair, menu à cases, contenu blanc 1136 px sur fond marine, pied sombre */
:root{
  --navy:#131F49; --green:#215D4B; --green2:#00884A; --gold:#F9CD34; --gold2:#F5C400; --red:#E52E2E; --red2:#7A1018;
  --bg:#FFFFFF; --page:#131F49; --head:#F4F6F5; --fg:#131F49; --text:#2B3340; --muted:#6B7280; --line:#E3E6EA;
  --panel:#EEF2F5; --cream:#FAF5F2; --tool:#EEF6F0; --foot:#1F2120; --foot2:#2A2C2B; --card:#FFFFFF; --ph:#D9DEE3; --ph2:#B9C2CB;
  --f-serif:"PT Serif",Georgia,serif; --f-ui:"Roboto",Arial,sans-serif; --f-pop:"Poppins",Arial,sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#10151F; --page:#0A1030; --head:#151B27; --fg:#E8ECF5; --text:#C9D0DC; --muted:#98A2B3; --line:#263042;
  --panel:#182131; --cream:#1A1F2A; --tool:#13261D; --card:#151C29; --ph:#263244; --ph2:#33445A; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#10151F; --page:#0A1030; --head:#151B27; --fg:#E8ECF5; --text:#C9D0DC; --muted:#98A2B3; --line:#263042;
  --panel:#182131; --cream:#1A1F2A; --tool:#13261D; --card:#151C29; --ph:#263244; --ph2:#33445A; color-scheme:dark}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--text);font-family:var(--f-ui);font-size:15px;line-height:1.5}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
h1,h2,h3,h4{margin:0;text-wrap:balance}
.serif{font-family:var(--f-serif)}
.logo-svg{display:block;height:auto;color:var(--fg)}

/* Barre du haut */
.top{border-top:8px solid #393B3A;background:var(--bg);border-bottom:1px solid var(--line)}
.top nav{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 17px;padding:10px 16px;font:700 13px var(--f-ui);color:var(--fg)}
.top nav a:hover{color:var(--green2)}

/* En-tête */
.head{background:var(--head);border-bottom:3px solid var(--green)}
.head-in{max-width:1220px;margin:0 auto;padding:14px 16px 12px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px}
.hicons{display:flex;gap:26px;align-items:center}
.hicons button{background:none;border:0;padding:4px;cursor:pointer;color:var(--fg);display:grid}
.hicons svg{width:26px;height:26px}
.brand{text-align:center}
.brand .logo-svg{width:min(330px,60vw);margin:0 auto}
.brand .slogan{display:block;margin:6px 0 0;font:700 14px var(--f-ui);color:var(--fg)}
.hright{display:flex;justify-content:flex-end;align-items:center;gap:20px}
.login{display:flex;align-items:center;gap:10px;font:400 15px var(--f-ui);color:var(--fg);background:none;border:0;cursor:pointer}
.login svg{width:20px;height:22px}
.sub{background:var(--gold);color:#131F49;padding:10px 34px 8px;text-align:center;line-height:1.1;display:block}
.sub b{font:700 17px var(--f-pop);display:block}
.sub small{font-size:11px}
.sub:hover{background:var(--gold2)}

/* Menu */
.menu{background:var(--bg);border-bottom:1px solid var(--line);position:sticky;top:env(safe-area-inset-top,0px);z-index:20}
.menu ul{list-style:none;margin:0 auto;padding:0;display:flex;justify-content:center;max-width:1220px;overflow-x:auto;scrollbar-width:none}
.menu ul::-webkit-scrollbar{display:none}
.menu li{border-left:1px solid var(--line);flex:none}
.menu li:last-child{border-right:1px solid var(--line)}
.menu a{display:flex;align-items:center;height:58px;padding:0 16px;font:700 14.5px var(--f-ui);color:var(--fg);white-space:nowrap}
.menu a:hover,.menu a.on{color:var(--green2);box-shadow:inset 0 -3px 0 var(--green2)}
.menu svg{width:22px;height:22px}

/* Pubs */
.adlbl{display:block;text-align:center;font:500 11px var(--f-ui);letter-spacing:.16em;color:var(--muted);margin-bottom:8px;text-transform:uppercase}
.adwrap{max-width:946px;margin:0 auto;padding:26px 16px 22px}
.adban{border-radius:10px;background:linear-gradient(110deg,#0A2E21 0%,#0B3A29 45%,#1B5C42 100%);color:#fff;padding:26px 30px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;box-shadow:0 10px 24px rgba(0,0,0,.18)}
.adban small,.adcard small{font:700 11px var(--f-ui);letter-spacing:.14em;color:var(--gold);text-transform:uppercase}
.adban .h{font:600 27px var(--f-pop);margin:6px 0 4px}
.adban p{margin:0;font-size:13.5px;opacity:.9}
.adbtn{background:var(--gold2);color:#131F49;font:700 13px var(--f-ui);padding:12px 17px;border-radius:5px;display:inline-block}
.adbtn:hover{background:#FFD84D}

/* Conteneur marine */
.navy{background:var(--page)}
.box{max-width:1136px;margin:0 auto;background:var(--bg)}
.pad{padding:40px 64px}

/* Une */
.une{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr) minmax(0,.95fr);gap:0}
.une-l{padding:40px 30px 40px 20px}
.ph{background:linear-gradient(135deg,var(--ph),var(--ph2));position:relative;overflow:hidden;max-width:100%}
.ph::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 30%,rgba(255,255,255,.28),transparent 50%)}
.ph[data-c="mines"]{--ph:#8C6A4F;--ph2:#4A3527}.ph[data-c="eco"]{--ph:#3E7A62;--ph2:#1D3F33}.ph[data-c="sport"]{--ph:#B23A3A;--ph2:#5E1C1C}.ph[data-c="inter"]{--ph:#4A6286;--ph2:#1F2E47}.ph[data-c="agri"]{--ph:#8F9B4B;--ph2:#4A5626}.ph[data-c="tech"]{--ph:#5A5E9E;--ph2:#262A55}.ph[data-c="banque"]{--ph:#A88B4A;--ph2:#5A4520}.ph[data-c="actu"]{--ph:#7A8899;--ph2:#3C4655}
.lead .ph{aspect-ratio:16/10.5}
.lead h2{font:700 32px/1.15 var(--f-serif);color:var(--fg);margin:22px 0 14px}
.meta{font:400 14px var(--f-serif);color:var(--text);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}
.cat{font:700 14px var(--f-serif);color:var(--red)}
.cat.up{text-transform:uppercase}
.lead .ex{font:400 17px/1.65 var(--f-serif);color:var(--text);margin:18px 0 0}
.sub2{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin:22px 44px 0;padding-block:20px;border-block:1px solid var(--line)}
.sub2 h3{font:700 15px/1.25 var(--f-serif);color:var(--fg);margin-top:10px}
.fil{padding:40px 22px}
.fil>h2{font:700 17px var(--f-serif);color:var(--red);margin-bottom:18px}
.fil .ph{aspect-ratio:16/10}
.fil article{padding-block:16px;border-bottom:1px solid var(--line)}
.fil article:first-of-type h3{font-size:20px;margin-top:16px}
.fil h3{font:700 16px/1.22 var(--f-serif);color:var(--fg);margin-bottom:10px}
.fil .meta{font-size:12px}
.fil .cat{font-size:12px}
.dec{background:var(--panel);padding:40px 30px}
.dec>h2{font:700 17px var(--f-serif);color:var(--fg);margin-bottom:16px}
.dec article{display:grid;grid-template-columns:1fr 30px;gap:6px;padding-block:14px;border-bottom:1px solid #B9C2CB}
.dec article .cat{font-size:14px;display:block;margin-bottom:8px}
.dec h3{font:700 14px/1.3 var(--f-serif);color:var(--fg)}
.dec .n{font:400 42px/1 var(--f-serif);color:#C7CDD6;align-self:end}

/* Bande marine présentation + pubs */
.band{padding:56px 16px}
.band-in{max-width:898px;margin:0 auto;display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:24px;align-items:start}
.about{background:var(--card);border-radius:12px;border-top:4px solid var(--gold);padding:34px 28px}
.about small{font:700 11px var(--f-ui);letter-spacing:.12em;color:var(--green);text-transform:uppercase}
.about h2{font:700 29px/1.18 var(--f-ui);color:var(--fg);margin:16px 0 18px}
.about h2 span{color:#2B7A4B}
.about p{font-size:14.5px;line-height:1.75;margin:0 0 16px}
.about a{display:block;border-top:1px solid var(--line);padding-top:16px;font:700 14px var(--f-ui);color:var(--green)}
.adcard{border-radius:10px;color:#fff;padding:26px 25px;display:flex;flex-direction:column;gap:10px;min-height:280px}
.adcard.g{background:linear-gradient(135deg,#0A2E21,#1B5C42)}
.adcard.r{background:linear-gradient(135deg,#4A0A12,#7A1018);border-bottom:5px solid;border-image:linear-gradient(90deg,#CE1126 33%,#FCD116 33% 66%,#009460 66%) 1}
.adcard .h{font:600 28px/1.18 var(--f-pop)}
.adcard p{font-size:13px;margin:0;opacity:.9}
.adcard .adbtn{align-self:flex-start;margin-top:auto}
.play{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--gold2);color:#131F49;font-size:11px;margin-right:6px;vertical-align:middle}

/* Toute l'actualité + barre latérale */
.two{display:grid;grid-template-columns:minmax(0,1fr) 248px;gap:64px}
.stitle{display:flex;align-items:center;gap:20px;margin-bottom:28px}
.stitle h2{font:700 24px var(--f-serif);color:var(--fg);white-space:nowrap}
.stitle::after{content:"";flex:1;height:2px;background:var(--red)}
.stitle.c::before{content:"";flex:1;height:2px;background:var(--red)}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 30px}
.g3 .ph{aspect-ratio:4/3;margin-bottom:22px}
.g3 h3{font:700 17px/1.27 var(--f-serif);color:var(--fg);margin-bottom:12px}
.g3 .meta{font-size:12.5px}.g3 .cat{font-size:12.5px}
.g3 .ex{font:400 15.5px/1.6 var(--f-serif);color:var(--text);margin:12px 0 0}
.more{display:flex;justify-content:center;margin-top:40px}
.more button{background:var(--bg);border:1px solid var(--line);color:var(--text);font:400 12px var(--f-serif);padding:15px 26px;cursor:pointer}
.more button:hover{border-color:var(--fg)}
.tools{display:flex;flex-direction:column;gap:14px}
.tl{background:var(--tool);border:1px solid #D6E8DB;border-radius:8px;padding:12px 14px;font:700 14px var(--f-ui);color:var(--green)}
.tl span{color:var(--fg)}
.tool{border:1px solid #DDE6E0;border-radius:10px;padding:18px;background:var(--card)}
.tool .h{font:600 20px/1.25 var(--f-pop);color:#183C28;margin-bottom:14px}
:root[data-theme="dark"] .tool .h{color:var(--fg)}
.tool label{display:block;font:700 12px var(--f-ui);color:var(--fg);margin:10px 0 6px}
.tool select,.tool input{width:100%;height:42px;border:1px solid #C9D3CD;border-radius:5px;padding:0 10px;font:15px var(--f-ui);background:var(--bg);color:var(--fg)}
.wx-t{font:700 20px var(--f-ui);color:var(--green2);margin-top:14px}
.tool p{margin:6px 0;font-size:14px;color:var(--fg)}
.tool small{display:block;font-size:12px;color:var(--muted);margin-top:6px}
.tool small a{color:var(--green2);text-decoration:underline}
.gbtn{background:var(--green2);color:#fff;border:0;border-radius:5px;padding:11px 14px;font:700 14px var(--f-ui);cursor:pointer}
.gbtn:hover{background:#00703C}
.fxr{font:700 20px/1.35 var(--f-ui);color:var(--green2);margin-top:14px;font-variant-numeric:tabular-nums}
.brow{display:flex;gap:10px;margin-top:12px}.brow .gbtn{flex:1}
.rubs{background:var(--cream);padding:30px}
.rubs .h{font:700 16px var(--f-serif);color:var(--fg);margin-bottom:16px}
.rubs a{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #B9C2CB;font:400 12px var(--f-serif);text-transform:uppercase;letter-spacing:.03em;color:var(--fg)}

/* Blocs rubriques */
.rb3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.rbt{background:var(--panel);padding:44px 20px;font:700 22px var(--f-serif);color:var(--fg);margin-bottom:28px}
.rb .ph{aspect-ratio:16/9.5;margin-bottom:22px}
.rb h3{font:700 19px/1.27 var(--f-serif);color:var(--fg);padding-bottom:14px;border-bottom:1px solid #B9C2CB}
.rb .mins{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:36px;border-top:1px solid #B9C2CB;padding-top:20px}
.rb .mins a{display:block;font:400 13px/1.3 var(--f-serif);color:var(--fg);padding-bottom:14px;border-bottom:1px solid #B9C2CB;margin-bottom:14px}
.rb .mins a:last-child{border:0}
.mines{background:var(--cream)}
.mn{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:48px}
.mn .g2{display:grid;grid-template-columns:1fr 1fr;gap:40px 48px}
.mn .g2 .ph{aspect-ratio:16/9.5;margin-bottom:18px}
.mn .g2 h3{font:400 20px/1.25 var(--f-ui);color:var(--fg);margin-bottom:6px}
.tdm{display:flex;align-items:center;gap:8px;font:400 11px var(--f-ui);color:var(--muted)}
.tdm .b{background:#222;color:#fff;font-weight:700;padding:2px 6px}
.tdm b{color:var(--fg)}
.tdm .cnt{margin-left:auto;background:#000;color:#fff;font-weight:700;padding:1px 6px}

/* Newsletter */
.nlw{padding:40px 16px}
.nl{max-width:1088px;margin:0 auto;background:var(--card);border-radius:16px;padding:40px;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:32px}
.nl-l{display:grid;grid-template-columns:4px 1fr;gap:0 18px}
.nl-l .bars{display:flex;flex-direction:column;gap:12px}
.nl-l .bars i{flex:1;background:var(--navy)}
.nl-l .bars i:nth-child(2){background:var(--gold2)}.nl-l .bars i:nth-child(3){background:var(--green)}.nl-l .bars i:nth-child(4){background:#B91C1C}
.nl-logo svg,.nl-logo img{width:200px;margin-bottom:26px}
.nl h2{font:700 38px/1.18 var(--f-ui);color:var(--fg);letter-spacing:-.01em}
.nl h2::after{content:"";display:block;width:64px;height:4px;background:var(--gold2);margin:18px 0}
.nl-l p{margin:0;font-size:16.5px;line-height:1.75}
.nl form{border-left:1px solid var(--line);padding-left:32px;display:flex;flex-direction:column;gap:12px;justify-content:center}
.nl label{font:700 13px var(--f-ui);color:var(--fg)}
.nl input[type=email]{height:52px;border:1px solid #C9D0D8;border-radius:8px;padding:0 14px;font:15px var(--f-ui);background:var(--bg);color:var(--fg)}
.nl .chk{display:flex;gap:10px;align-items:center;font-size:13px}
.nl button{height:50px;background:var(--green);color:#fff;border:0;border-radius:8px;font:700 16px var(--f-ui);cursor:pointer}
.nl .msg{font-size:11.5px;color:#3B5A8A;text-align:center;margin:0}

/* Pied de page */
.foot{background:var(--foot);color:#C8CCC9;border-top:4px solid var(--green2)}
.fi{max-width:1220px;margin:0 auto;padding-inline:16px}
.arch{background:var(--foot2);padding-block:22px 26px}
.arch .h4,.foot .h4{font:700 15px var(--f-ui);color:#fff;letter-spacing:.04em;text-transform:uppercase;margin-bottom:16px}
.arch .yrs{display:flex;gap:10px}
.arch .yrs a{background:#3A3D3C;color:#E5E7E6;font:700 14px var(--f-ui);padding:11px 19px;border-radius:3px}
.fcols{display:grid;grid-template-columns:1fr 1fr 1.1fr 1fr;gap:28px;padding-block:44px 30px}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;font-size:14.5px}
.foot ul a:hover{color:#fff}
.fct .h5{font:700 13px var(--f-ui);color:#fff;text-transform:uppercase;margin:20px 0 8px}
.fct p{margin:0;font-size:14.5px;line-height:1.7}
.flegal{border-top:1px solid #3A3D3C;padding-block:24px;text-align:center;font-size:12px;line-height:1.8;max-width:1000px;margin:0 auto}
.flegal a{text-decoration:underline}
.fbot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding-block:6px 26px;font-size:12.5px}
.fbot b{color:var(--gold2);text-decoration:underline}

/* Article */
.art-wrap{display:grid;grid-template-columns:minmax(0,1fr) 256px;gap:104px;padding:20px 84px 40px}
.art .cat{font-size:17px;text-transform:uppercase}
.art .rt{font:400 15px var(--f-serif);margin-left:28px}
.art h1{font:700 38px/1.27 var(--f-serif);color:var(--fg);margin:20px 0 30px}
.byline{display:flex;align-items:center;gap:16px;flex-wrap:wrap;border-block:1px solid var(--line);padding-block:10px;font:400 14px var(--f-serif)}
.byline b{color:var(--fg)}
.byline .sep{width:1px;height:20px;background:var(--line)}
.shr{margin-left:auto;display:flex;gap:6px}
.shr button{width:40px;height:40px;border:0;background:var(--navy);color:#fff;font:700 12px var(--f-ui);cursor:pointer}
.art .ph{aspect-ratio:16/9;margin:30px 0}
.art .body{font:400 17px/1.75 var(--f-serif);color:var(--text)}
.art .body p{margin:0 0 22px}
.art .body h4{font:700 17px var(--f-serif);color:var(--fg);margin:28px 0 14px}
.soutien{background:var(--panel);border-left:4px solid var(--green);padding:24px;margin:30px 0;border-radius:4px}
.soutien small{font:700 11px var(--f-ui);letter-spacing:.12em;color:var(--green);text-transform:uppercase}
.soutien .h3{font:700 22px var(--f-ui);color:var(--fg);margin:8px 0}
.soutien p{margin:0 0 14px}
.pn{display:grid;grid-template-columns:1fr 1fr;gap:30px;border-top:1px solid var(--line);padding-top:20px;margin-top:30px}
.pn small{font:400 13px var(--f-ui);color:var(--muted)}
.pn b{display:block;font:700 15px/1.35 var(--f-serif);color:var(--fg);margin-top:4px}
.pn a:last-child{text-align:right}

/* Rubrique */
.crumb{font-size:12px;color:#A0A6AE;padding-top:24px}
.rhead{display:flex;justify-content:space-between;align-items:center;margin:14px 0 20px}
.rhead h1{font:700 30px var(--f-pop);color:var(--fg);text-transform:uppercase}
.rhead select{background:#222;color:#fff;border:0;font:500 11px var(--f-ui);padding:9px 14px;text-transform:uppercase}
.mosaic{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:200px 200px;gap:3px}
.mosaic a{position:relative;display:block}
.mosaic a:first-child{grid-row:1/3}
.mosaic .ph{position:absolute;inset:0}
.mosaic .ov{position:absolute;inset:auto 0 0 0;padding:16px;background:linear-gradient(transparent,rgba(0,0,0,.7));color:#fff;font:400 16px/1.3 var(--f-ui);z-index:1}
.mosaic a:first-child .ov{font-size:27px;padding:20px}
.mosaic .ov small{display:block;font-size:11px;margin-top:8px}
.rgrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;margin-top:48px}
.rgrid .g2c{display:grid;grid-template-columns:1fr 1fr;gap:40px 48px}
.rgrid .g2c .ph{aspect-ratio:16/10;margin-bottom:16px}
.rgrid .g2c h2,.rgrid .g2c h3{font:400 20px/1.25 var(--f-ui);color:var(--fg);margin-bottom:6px}
.pager{display:flex;gap:6px;margin-top:40px;flex-wrap:wrap}
.pager a{min-width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);font-size:13px;padding:0 10px}
.pager a.on{background:#222;color:#fff;border-color:#222}

/* Pages info (modèle vert) */
.info{max-width:1000px;margin:24px auto 64px;padding-inline:16px;color:var(--text);line-height:1.75}
.info .ih{background:var(--green);color:#fff;padding:40px 28px;border-bottom:5px solid #F9B800;border-radius:12px 12px 0 0}
.info .ih small{font-size:12px;letter-spacing:2px;font-weight:700;color:#F9B800}
.info .ih h1{color:#fff;font:700 32px/1.2 var(--f-ui);margin:12px 0}
.info .ih p{font-size:18px;margin:0}
.info .toc{padding:20px 28px;background:var(--panel);display:flex;flex-wrap:wrap;gap:6px 18px}
.info .toc a{color:var(--green);text-decoration:underline}
:root[data-theme="dark"] .info .toc a{color:#7FD3A8}
.info .ib{padding:12px 28px;background:var(--card);border:1px solid var(--line)}
.info section{padding:22px 0;border-bottom:1px solid var(--line)}
.info .ib h2{font:700 23px var(--f-ui);color:var(--green)}
:root[data-theme="dark"] .info .ib h2{color:#7FD3A8}
.cform{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:10px}
.cform .full{grid-column:1/-1}
.cform input,.cform textarea,.cform select{width:100%;padding:11px;border:1px solid var(--line);border-radius:6px;font:15px var(--f-ui);background:var(--bg);color:var(--fg)}
.ok{background:var(--tool);color:var(--fg);padding:10px;border-radius:6px;font-weight:600}

/* Publicité */
.pub-hero{background:linear-gradient(120deg,#0A2E21,#163F2F 60%,#1B5C42);color:#fff;padding:60px 16px}
.pub-hero .in{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}
.pub-hero small{font:700 12px var(--f-ui);letter-spacing:.14em;color:var(--gold)}
.pub-hero h1{font:700 46px/1.1 var(--f-pop);margin:14px 0}
.pub-hero p{font-size:17px;opacity:.9;max-width:48ch}
.pub-hero .mock{background:#fff;border-radius:12px;padding:16px;color:#131F49}
.pub-hero .mock .bar{height:12px;background:#E3E6EA;border-radius:3px;margin-bottom:8px}
.pub-hero .mock .ad{background:var(--gold2);border-radius:6px;padding:14px;font:700 16px var(--f-pop);margin:10px 0}
.fmts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.fmt{border:1px solid var(--line);border-radius:12px;padding:22px;background:var(--card);display:flex;flex-direction:column;gap:8px}
.fmt .vis{background:var(--panel);border-radius:6px;aspect-ratio:16/9;position:relative;margin-bottom:8px}
.fmt .vis i{position:absolute;background:var(--gold2);border-radius:2px;box-shadow:0 0 0 2px #131F49 inset}
.fmt small{font:700 11px var(--f-ui);letter-spacing:.1em;color:var(--green)}
.fmt h3{font:700 22px var(--f-pop);color:var(--fg)}
.fmt b{font-size:13px;color:var(--fg)}
.fmt p{margin:0;font-size:14px}
.fmt a{margin-top:auto;font:700 13px var(--f-ui);color:var(--green)}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;counter-reset:s}
.steps div{border-top:3px solid var(--green);padding-top:14px;counter-increment:s}
.steps div::before{content:"0" counter(s) " /";font:700 14px var(--f-ui);color:var(--green)}
.steps h3{font:700 19px var(--f-ui);color:var(--fg);margin:6px 0}
details{border-bottom:1px solid var(--line);padding-block:14px}
summary{font-weight:700;color:var(--fg);cursor:pointer}
/* Abonnement */
.cs{max-width:1080px;margin:25px auto 60px;padding-inline:16px}
.cs-intro small{color:#C60916;font-weight:800;letter-spacing:2px}
.cs-intro h1{font:800 43px/1.15 var(--f-ui);color:#183C28;margin:12px 0}
:root[data-theme="dark"] .cs-intro h1{color:var(--fg)}
.notice{background:#FFF4C7;color:#3A3000;border-left:4px solid #E5B900;padding:15px 20px;border-radius:5px;font-size:14px;margin:20px 0 25px}
.cs-lay{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px}
.picker{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:25px}
.picker .h3{font:800 23px var(--f-ui);color:var(--fg);margin-bottom:18px}
.opt{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;border:2px solid var(--line);border-radius:10px;padding:19px 17px;background:var(--card);margin-bottom:12px;cursor:pointer}
.opt input{accent-color:#C90916;width:18px;height:18px}
.opt strong{font-size:18px;color:var(--fg)}.opt small{display:block;font-size:12px;color:var(--muted)}
.opt em{font-size:12px;color:#C90916;font-style:normal;font-weight:700}
.opt:has(input:checked){border-color:#C90916}
.redbtn{display:block;text-align:center;background:#C90916;color:#fff;padding:15px;border-radius:7px;font-weight:800;margin-top:16px}
.story{background:#193B2B;color:#fff;border-radius:14px;padding:30px;border-top:5px solid #F5C400}
.story small{color:#FFE05B;font-size:11px;font-weight:800;letter-spacing:2px}
.story .h3{font:800 30px/1.2 var(--f-ui);margin:14px 0 20px}
.story ul{list-style:none;padding:0}.story li{padding-left:25px;position:relative;margin-bottom:16px;font-size:14px}
.story li::before{content:"✓";position:absolute;left:0;color:#FFDC51;font-weight:700}
/* TV */
.tvh{background:linear-gradient(135deg,#131F49,#1C2C66);color:#fff;padding:56px 16px;text-align:center}
.tvh h1{font:700 44px var(--f-pop)}
.tvh p{opacity:.85}

.totop{position:fixed;right:0;top:50%;width:40px;height:40px;background:var(--red);color:#fff;border:0;font-size:18px;cursor:pointer;z-index:30}

/* Tiroir + connexion */
.drawer{position:fixed;inset:0;z-index:70;display:flex}
.drawer .p{width:min(380px,90vw);background:var(--bg);color:var(--fg);padding:24px;overflow:auto;display:flex;flex-direction:column;gap:20px;padding-top:calc(24px + env(safe-area-inset-top,0px))}
.drawer .v{flex:1;background:rgba(10,15,40,.55)}
.drawer .h4{font:700 12px var(--f-ui);letter-spacing:.12em;color:var(--green);text-transform:uppercase;margin-bottom:6px}
.drawer ul{list-style:none;margin:0;padding:0}
.drawer li a{display:block;padding:8px 0;border-bottom:1px solid var(--line);font:700 15px var(--f-ui)}
.drawer .s{display:flex;border:1px solid var(--line)}
.drawer .s input{flex:1;min-width:0;border:0;padding:12px;font:15px var(--f-ui);background:var(--bg);color:var(--fg)}
.drawer .s button{background:var(--green);color:#fff;border:0;padding:0 16px;font-weight:700}
.drawer .bro{background:var(--gold);color:#131F49;padding:14px;border-radius:8px;font-weight:700}
.drawer .absub{background:var(--panel);padding:16px;border-radius:8px;font-size:14px}
.close{align-self:flex-end;background:none;border:0;font-size:28px;line-height:1;cursor:pointer;color:inherit}
.modal{position:fixed;inset:0;z-index:80;background:rgba(10,15,40,.6);display:grid;place-items:center;padding:16px}
.modal .b{background:var(--card);border-radius:4px;padding:30px;width:min(390px,100%);display:flex;flex-direction:column;gap:12px;color:var(--fg)}
.modal .h3{font:700 22px var(--f-ui)}
.modal input{height:44px;border:1px solid var(--line);padding:0 12px;font:15px var(--f-ui);background:var(--bg);color:var(--fg)}
.modal .go{background:var(--green2);color:#fff;border:0;height:44px;font-weight:700;cursor:pointer}


/* ===== Thème WordPress : compléments ===== */
html{-webkit-text-size-adjust:100%;scroll-padding-top:70px}
body{margin:0;overflow-x:hidden}
img,svg,video,iframe{max-width:100%}
img{height:auto}
button,input,select,textarea{font:inherit}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--gold);color:#131F49;padding:10px 16px;font-weight:700}
.skip:focus{left:8px}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}
.h3{font:700 22px var(--f-ui);color:var(--fg);margin:0}
.h4{margin:0}
.h5{margin:0}
.logo-img{display:block;width:min(330px,60vw);height:auto;margin:0 auto}
.top nav{align-items:center}
.top .today{font-weight:400;color:var(--muted);text-transform:capitalize}
.top .lang{display:inline-flex;gap:8px}
.top .lang a{padding:0 2px}
.top .lang a[aria-current]{color:var(--green2)}
.top nav a{white-space:nowrap}
.top .tmenu{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 17px}
.menu ul{list-style:none}
.menu .current-menu-item>a,.menu .current-post-ancestor>a,.menu .current-menu-parent>a,.menu .current-category-ancestor>a{color:var(--green2);box-shadow:inset 0 -3px 0 var(--green2)}
.menu.stuck{box-shadow:0 4px 14px rgba(0,0,0,.08)}

/* Flash info */

/* Images réelles dans les blocs .ph */
.ph{display:block;background:linear-gradient(135deg,var(--ph),var(--ph2))}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:1}
.ph:not(.ph-empty)::after{display:none}
.lead .ph,.fil .ph,.g3 .ph,.rb .ph,.mn .g2 .ph,.rgrid .g2c .ph{display:block}
.lead h2 a:hover,.g3 h3 a:hover,.fil h3 a:hover,.dec h3 a:hover,.rb h3 a:hover,.rb .mins a:hover,.sub2 h3 a:hover,.mn .g2 h3 a:hover,.rgrid h2 a:hover,.rbt a:hover{color:var(--green2)}
.cat:hover{text-decoration:underline}
.meta time{white-space:nowrap}
.sub2 h3{margin-top:6px}
.adban .h,.adcard .h{margin:6px 0 4px}
.adcard.sm{min-height:0}
.adcard.sm .h{font-size:22px}
.adslot{text-align:center;padding:20px 16px}
.adslot .adcode{display:flex;justify-content:center;overflow:hidden}
.adslot-header{max-width:1000px;margin:0 auto}
.adin{padding:0 0 24px;font-family:var(--f-ui)}
.adin .h{font-size:22px}
.ad-mobile{display:none}
@media (max-width:700px){.ad-mobile{display:flex;justify-content:center;position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--bg);box-shadow:0 -4px 14px rgba(0,0,0,.12);padding:4px 0 calc(4px + env(safe-area-inset-bottom,0px))}body:has(.ad-mobile){padding-bottom:110px}}
.ad-skin{display:none}
@media (min-width:1500px){.ad-skin{display:block;position:fixed;inset:0;z-index:-1}.ad-skin>*{width:100%;height:100%}}
.bandad .adlbl{color:#8A93B8}
.tools{min-width:0}
.tool label{display:block}
.tool select,.tool input{margin-top:6px}
.rubs .h{font:700 16px var(--f-serif);color:var(--fg);margin-bottom:16px}
.rubs a:hover span:first-child{color:var(--green2)}
.widget{border:1px solid var(--line);border-radius:10px;padding:18px}
.widget-title{font:700 16px var(--f-serif);color:var(--fg);margin-bottom:12px}
.rb{min-width:0}
.rbt a{display:block}
.rb .mins.one{grid-template-columns:1fr}
.mines .rb .rbt{background:var(--bg)}
.stitle h2 a:hover{color:var(--green2)}
.foot a:hover{color:#fff}
.foot .ph-n a{color:#fff;font-weight:700}
.fct a{word-break:break-word}
.socials{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.socials a{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#3A3D3C;color:#fff}
.socials a:hover{background:var(--green2)}
.socials svg{width:18px;height:18px}
.drawer .socials a{background:var(--navy)}
.arch .yrs{flex-wrap:wrap}
.arch .yrs a:hover{background:var(--green2);color:#fff}
.fbot a b{color:var(--gold2)}
.totop{display:grid;place-items:center;padding:0}
.totop svg{width:22px;height:22px}
.drawer .p{max-height:100dvh}
.drawer ul a:hover{color:var(--green2)}
.drawer .absub a{color:var(--green);font-weight:700}
.drawer .bro small{font-weight:400}
.modal .b p{margin:0}
.modal form{display:flex;flex-direction:column;gap:10px}
.modal form p{margin:0;display:flex;flex-direction:column;gap:4px;font-size:13px}
.modal form .login-remember{flex-direction:row}
.modal form label{font-weight:600}
.modal input[type=text],.modal input[type=password]{height:44px;border:1px solid var(--line);padding:0 12px;font:15px var(--f-ui);background:var(--bg);color:var(--fg)}
.modal input[type=submit]{background:var(--green2);color:#fff;border:0;height:44px;font-weight:700;cursor:pointer;width:100%}
.modal .links{font-size:13px}
.modal .links a{color:var(--green2)}
body.g28-lock{overflow:hidden}

/* Fil d'Ariane */
.crumb{font-size:12.5px;color:#7C838C;padding-top:20px}
.crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px}
.crumb li+li::before{content:"›";margin:0 8px;color:#A0A6AE}
.crumb a:hover{color:var(--green2)}
.art .crumb{padding-top:0;margin-bottom:16px}

/* Article */
.art{min-width:0}
.art-top{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px}
.art .rt{margin-left:22px}
.byline a:hover b{color:var(--green2)}
.shr a,.shr button{width:40px;height:40px;border:0;background:var(--navy);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0}
.shr a:hover,.shr button:hover{background:var(--green2)}
.shr svg{width:18px;height:18px}
.shr .done{background:var(--green2)}
.hero{margin:30px 0}
.hero img{width:100%;display:block}
.hero figcaption{font-size:13px;color:var(--muted);margin-top:8px}
.art .body{overflow-wrap:break-word}
.art .body a{color:var(--green2);text-decoration:underline}
.art .body h2,.art .body h3{font:700 22px/1.3 var(--f-serif);color:var(--fg);margin:30px 0 14px}
.art .body h3{font-size:19px}
.art .body img{height:auto}
.art .body figure{margin:24px 0;max-width:100%}
.art .body figcaption,.art .body .wp-caption-text{font-size:13px;color:var(--muted)}
.art .body .wp-caption{max-width:100%}
.art .body blockquote{margin:26px 0;padding:6px 0 6px 20px;border-left:4px solid var(--gold);font-style:italic;color:var(--fg)}
.art .body ul,.art .body ol{padding-left:22px;margin:0 0 22px}
.art .body table{width:100%;border-collapse:collapse;display:block;overflow-x:auto;font-size:15px}
.art .body td,.art .body th{border:1px solid var(--line);padding:8px}
.art .body iframe{width:100%}
.art .body .wp-block-embed iframe,.art .body iframe[src*="youtube"]{aspect-ratio:16/9;height:auto}
.art .body .alignleft{float:left;margin:6px 20px 12px 0}
.art .body .alignright{float:right;margin:6px 0 12px 20px}
.art .body .aligncenter{margin-inline:auto;display:block}
.tags{margin:24px 0 0;display:flex;flex-wrap:wrap;gap:6px;font-size:13px}
.tags span{font-weight:700;color:var(--fg)}
.tags a{background:var(--panel);padding:4px 10px;border-radius:3px}
.tags a:hover{background:var(--green2);color:#fff}
.soutien .h3{margin:8px 0}
.soutien .adbtn{margin-top:4px}
.rel{margin-top:40px}
.rel .g3{gap:30px 24px}
.pn a:hover b{color:var(--green2)}
.comments{margin-top:44px}
.comment-list{list-style:none;padding:0;margin:0 0 30px}
.comment-list .children{list-style:none;padding-left:24px}
.comment-body{border-bottom:1px solid var(--line);padding:16px 0}
.comment-author{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--fg)}
.comment-author img{border-radius:50%}
.comment-metadata{font-size:12px;color:var(--muted);margin:4px 0 8px}
.comment-respond{background:var(--panel);padding:22px;border-radius:8px}
.comment-reply-title{font:700 20px var(--f-ui);color:var(--fg);margin-bottom:10px}
.comment-form p{margin:0 0 12px}
.comment-form label{display:block;font-weight:600;font-size:13px;margin-bottom:4px;color:var(--fg)}
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea{width:100%;padding:10px;border:1px solid var(--line);border-radius:5px;background:var(--bg);color:var(--fg)}
.comment-form .comment-form-cookies-consent{display:flex;gap:8px;align-items:flex-start}
.comment-form .comment-form-cookies-consent label{display:inline;font-weight:400}

/* Listes : rubriques, recherche */
.listing{max-width:1136px;padding-inline:16px}
.rhead{gap:16px;flex-wrap:wrap}
.rhead h1 small{font:400 14px var(--f-ui);color:var(--muted);text-transform:none}
.rhead select{cursor:pointer}
.tdesc{font:400 16px/1.6 var(--f-serif);margin:-6px 0 22px;max-width:75ch}
.mosaic .ov .mt{font:inherit;color:#fff;margin:0}
.mosaic a .ph{display:block}
.mosaic a:hover .mt{text-decoration:underline}
.mosaic .ov{z-index:2}
.rgrid .g2c h2{font:400 20px/1.25 var(--f-ui);color:var(--fg);margin-bottom:6px}
.rgrid .g2c .ex{font:400 15px/1.55 var(--f-serif);margin:8px 0 0}
.rgrid{padding-bottom:56px}
.pager a,.pager span{min-width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);font-size:13px;padding:0 10px}
.pager .current{background:#222;color:#fff;border-color:#222}
.pager .dots{border:0}
.pager a:hover{border-color:var(--fg)}
.empty{padding:20px 0}
.searchform{display:flex;gap:8px;max-width:520px;margin:16px 0}
.searchform input{flex:1;min-width:0;height:44px;border:1px solid var(--line);padding:0 12px;background:var(--bg);color:var(--fg)}
.page-std{max-width:1136px;padding-inline:16px}
.page-std .art h1{margin-top:10px}
.e404{text-align:center;padding:60px 0 40px;max-width:620px;margin:0 auto}
.e404 .big{font:700 110px/1 var(--f-pop);color:var(--red);margin:0}
.e404 h1{font:700 30px var(--f-serif);color:var(--fg);margin:10px 0}
.e404 .searchform{margin-inline:auto}
.e404 .gbtn{display:inline-block}

/* Pages d'information */
.box.wide{max-width:1100px;padding-inline:16px;background:transparent}
.info .ih small{display:block}
.info .ib h2{margin:0 0 10px}
.info .ib .body{font:inherit;color:inherit}
.info .ib .body h2{padding-top:22px;border-top:1px solid var(--line);margin-top:22px}
.info .ib .body h2:first-child{border-top:0;margin-top:0}
.info .ib .body a{color:var(--green);text-decoration:underline}
.info section.last{border-bottom:0}
.info .cont{background:var(--panel);border-radius:8px;padding:18px 20px;margin-top:26px}
.info .cont .h4{font:700 15px var(--f-ui);color:var(--fg);margin-bottom:6px}
.info .cont a,.info .back{color:var(--green);font-weight:700}
.info section a{color:var(--green)}
.cform label{display:block}
.cform .full{grid-column:1/-1}
.ok.err{background:#FDECEC;color:#7A1018}
.tools-page{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin:20px 0}
.tools-page .tl{grid-column:1/-1}

/* Publicité, abonnement, TV */
.pub-hero h1{color:#fff}
.bro-box{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center;margin-top:0}
.bro-box p{margin:0}
.bro-box .btns{display:flex;gap:10px;flex-wrap:wrap}
.gbtn{display:inline-block;text-align:center}
.lbtn{background:none;border:1px solid currentColor;border-radius:5px;padding:10px 14px;font:700 14px var(--f-ui);color:inherit;cursor:pointer}
.fmts,.steps,.faq{margin-bottom:50px}
.box .stitle{margin-top:10px}
.cta{background:var(--panel);border-radius:12px;padding:30px;text-align:center}
.cta h2{font:700 26px var(--f-pop);color:var(--fg);margin-bottom:8px}
.cta a{color:var(--green)}
.cta .adbtn{color:#131F49;margin-top:8px}
.picker{display:block}
.picker .h3{margin-bottom:18px}
.redbtn{width:100%;border:0;cursor:pointer;font:800 16px var(--f-ui)}
.story .h3{color:#fff}
.cs .faq{margin:36px 0 0}
.cs .faq .h3{font-size:26px;margin-bottom:8px}
.cs .soutien{margin-top:30px}
.tvh small{color:var(--gold);font-weight:700;letter-spacing:.14em}
.tvh h1{color:#fff;margin:6px 0}
.vid .yt{position:relative;display:block;width:100%;aspect-ratio:16/9;border:0;padding:0;background:#000;cursor:pointer;overflow:hidden}
.vid .yt img{width:100%;height:100%;object-fit:cover;display:block}
.vid iframe{width:100%;aspect-ratio:16/9;border:0;display:block}
.vid .play-b{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;background:#E52E2E;color:#fff;display:grid;place-items:center;font-size:20px}
.vid .h3{font:700 17px/1.3 var(--f-serif);margin:14px 0 6px}
.tvg{gap:36px 28px}
.more .adbtn{display:inline-block}

/* Newsletter */
.nlf .msg.err{color:#B91C1C}
.nl-logo{display:block;color:var(--fg)}
.nl-logo svg,.nl-logo img{width:200px;height:auto;margin:0 0 26px}

/* Bandeau cookies */
.cookie{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:90;max-width:760px;margin:0 auto;background:#131F49;color:#fff;border-radius:10px;padding:16px 18px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;box-shadow:0 12px 30px rgba(0,0,0,.3);font-size:14px}
.cookie p{margin:0;flex:1 1 280px}
.cookie a{color:var(--gold);text-decoration:underline}

/* Impression */
@media print{
  .top,.head,.menu,.adwrap,.adslot,.tools,.shr,.soutien,.rel,.pn,.comments,.foot,.totop,.drawer,.modal,.cookie,.ad-mobile,.nlw{display:none!important}
  .navy,.box{background:#fff!important}
  .art-wrap{display:block!important;padding:0!important}
  body{color:#000}
}

@media (max-width:1060px){
  .pad{padding:32px 24px}
  .une{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .une-l{grid-column:1/-1;padding:28px 24px}
  .two,.art-wrap,.rgrid{grid-template-columns:minmax(0,1fr);gap:40px}
  .art-wrap{padding:20px 24px 40px}
  .band-in{grid-template-columns:1fr 1fr}.about{grid-column:1/-1}
  .fcols{grid-template-columns:1fr 1fr}
  .mn{grid-template-columns:minmax(0,1fr)}
  .pub-hero .in{grid-template-columns:1fr}
  .top nav{gap:4px 12px}
}
@media (max-width:700px){
  .top nav{display:none}
  .head-in{grid-template-columns:auto minmax(0,1fr) auto;padding-inline:12px;gap:8px}
  .hright{gap:8px}
  .hicons{gap:12px}.hicons .dm{display:none}
  .brand .logo-svg{width:100%;max-width:200px}.brand .slogan{display:block;font-size:11px}
  .login span{display:none}.sub{padding:8px 10px}.sub small{display:none}.sub b{font-size:14px}
  .menu ul{justify-content:flex-start}
  .menu a{height:48px;padding:0 13px;font-size:14px}
  .adban .h{font-size:21px}
  .une{grid-template-columns:minmax(0,1fr)}
  .une-l,.fil,.dec{padding:24px 16px}
  .lead h2{font-size:25px}
  .sub2{margin:20px 0 0;grid-template-columns:1fr}
  .band-in,.g3,.rb3,.fmts,.steps,.cs-lay,.mn .g2,.rgrid .g2c,.cform,.pn{grid-template-columns:minmax(0,1fr)}
  .nl{grid-template-columns:minmax(0,1fr);padding:26px}
  .nl form{border-left:0;padding-left:0}
  .nl h2{font-size:28px}
  .fcols{grid-template-columns:minmax(0,1fr)}
  .art h1{font-size:28px}.shr{margin-left:0}
  .mosaic{grid-template-columns:1fr 1fr;grid-template-rows:240px 150px 150px}
  .mosaic a:first-child{grid-column:1/-1;grid-row:auto}
  .mosaic a:first-child .ov{font-size:21px}
  .pub-hero h1,.cs-intro h1,.tvh h1{font-size:32px}
  .rgrid .g2c h2{font-size:18px}
  .art .rt{margin-left:12px}
  .info .ih{padding:28px 20px}.info .ih h1{font-size:26px}
  .info .toc,.info .ib{padding-inline:18px}
  .cs-intro h1{font-size:30px}
  .e404 .big{font-size:80px}
  .art .body .alignleft,.art .body .alignright{float:none;margin:16px auto}
  .pad{padding:28px 16px}
  .rb .mins{grid-template-columns:1fr}
  .cookie{left:8px;right:8px}
  .stitle h2{white-space:normal;font-size:21px}
  .stitle{gap:14px}
}
