/* Fox Rider — Blog refonte 30/05/2026. Tokens cohérents avec le site. */
:root{
  --fr-orange:#ff6b35; --fr-orange-hover:#e85a28; --fr-orange-soft:#fff0e9;
  --fr-navy:#1a1a2e; --fr-bg:#ffffff; --fr-bg-soft:#f9f9f9;
  --fr-text:#2a2a32; --fr-muted:#8a8a93; --fr-border:#e6e6ea;
  --fr-radius:14px; --fr-shadow:0 4px 20px rgba(20,20,40,.07);
  --fr-shadow-hover:0 14px 40px rgba(20,20,40,.13);
  --fr-read:720px; --fr-ease:cubic-bezier(.22,.61,.36,1);
}

/* ---- conteneur global blog ---- */
.fr-blog{font-family:'Armata',Helvetica,Arial,sans-serif;color:var(--fr-text);max-width:1200px;margin:0 auto;padding:32px 20px 64px;}
.fr-blog *{box-sizing:border-box;}

/* ---- en-tête + pills de thèmes ---- */
.fr-blog-head{margin:8px 0 28px;}
.fr-blog-head h1{font-size:clamp(28px,4vw,40px);color:var(--fr-navy);margin:0 0 6px;letter-spacing:-.01em;}
.fr-blog-head p{color:var(--fr-muted);font-size:16px;margin:0;}
.fr-pills{display:flex;gap:10px;overflow-x:auto;padding:18px 0 8px;scrollbar-width:none;}
.fr-pills::-webkit-scrollbar{display:none;}
.fr-pill{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:999px;
  border:1.5px solid var(--fr-border);background:#fff;color:var(--fr-navy);font-size:14px;font-weight:600;
  text-decoration:none;white-space:nowrap;transition:all .25s var(--fr-ease);cursor:pointer;}
.fr-pill:hover{border-color:var(--fr-orange);color:var(--fr-orange);}
.fr-pill.is-active{background:var(--fr-orange);border-color:var(--fr-orange);color:#fff;}
.fr-pill .n{font-size:12px;opacity:.7;}

/* ---- article vedette (hero) ---- */
.fr-hero{display:grid;grid-template-columns:1.15fr 1fr;gap:0;border-radius:var(--fr-radius);overflow:hidden;
  border:1px solid var(--fr-border);box-shadow:var(--fr-shadow);margin-bottom:36px;background:#fff;}
.fr-hero__media{position:relative;min-height:340px;background:linear-gradient(135deg,#ff6b35,#1a1a2e);}
.fr-hero__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.fr-hero__body{padding:36px;display:flex;flex-direction:column;justify-content:center;}
.fr-hero__body h2{font-size:clamp(22px,2.6vw,32px);color:var(--fr-navy);line-height:1.2;margin:12px 0;letter-spacing:-.01em;}
.fr-hero__body h2 a{color:inherit;text-decoration:none;}
.fr-hero__body h2 a:hover{color:var(--fr-orange);}
.fr-hero__body p{color:var(--fr-muted);font-size:16px;line-height:1.6;margin:0 0 18px;}
.fr-hero__cta{align-self:flex-start;background:var(--fr-orange);color:#fff;padding:11px 22px;border-radius:8px;
  font-weight:700;text-decoration:none;transition:.25s var(--fr-ease);}
.fr-hero__cta:hover{background:var(--fr-orange-hover);transform:translateY(-2px);}

/* ---- grille de cartes ---- */
.fr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px;}
.fr-card{background:#fff;border:1px solid var(--fr-border);border-radius:var(--fr-radius);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .35s var(--fr-ease),box-shadow .35s var(--fr-ease);}
.fr-card:hover{transform:translateY(-6px);box-shadow:var(--fr-shadow-hover);}
.fr-card__media{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(135deg,#ff6b35,#1a1a2e);}
.fr-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--fr-ease);}
.fr-card:hover .fr-card__media img{transform:scale(1.06);}
.fr-badge{position:absolute;top:12px;left:12px;z-index:2;color:#fff;font-size:11px;font-weight:700;
  padding:5px 11px;border-radius:999px;text-transform:uppercase;letter-spacing:.04em;}
.fr-card__body{padding:18px 20px 22px;display:flex;flex-direction:column;flex:1;}
.fr-meta{color:var(--fr-muted);font-size:13px;display:flex;gap:8px;align-items:center;}
.fr-meta::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--fr-orange);}
.fr-card__title{font-size:18px;font-weight:700;line-height:1.3;margin:8px 0 8px;letter-spacing:-.01em;color:var(--fr-navy);}
.fr-card__title a{color:inherit;text-decoration:none;}
.fr-card__title a:hover{color:var(--fr-orange);}
.fr-card__excerpt{color:var(--fr-muted);font-size:14px;line-height:1.55;margin:0 0 14px;flex:1;}
.fr-card__more{color:var(--fr-orange);font-weight:700;font-size:14px;text-decoration:none;}

/* ---- pagination ---- */
.fr-pagination{display:flex;justify-content:center;gap:8px;margin-top:44px;}
.fr-pagination a,.fr-pagination span{padding:9px 15px;border-radius:8px;border:1px solid var(--fr-border);
  color:var(--fr-navy);text-decoration:none;font-weight:600;}
.fr-pagination .current{background:var(--fr-orange);color:#fff;border-color:var(--fr-orange);}

/* ============ SINGLE ARTICLE ============ */
.fr-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--fr-orange);z-index:9999;transition:width .1s linear;}
.fr-article-wrap{max-width:var(--fr-read);margin:0 auto;padding:24px 20px 64px;font-family:'Armata',Helvetica,Arial,sans-serif;}
.fr-article-hero{position:relative;border-radius:var(--fr-radius);overflow:hidden;margin-bottom:28px;
  min-height:280px;background:linear-gradient(135deg,#ff6b35,#1a1a2e);display:flex;align-items:flex-end;}
.fr-article-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.fr-article-hero__overlay{position:relative;z-index:2;padding:28px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.72));width:100%;}
.fr-article-hero h1{color:#fff;font-size:clamp(26px,4vw,40px);line-height:1.18;margin:10px 0 0;letter-spacing:-.01em;}
.fr-article-meta{display:flex;gap:14px;align-items:center;color:var(--fr-muted);font-size:14px;margin-bottom:24px;flex-wrap:wrap;}
.fr-article-body{font-size:18px;line-height:1.75;color:var(--fr-text);}
.fr-article-body h2{font-size:26px;color:var(--fr-navy);margin:42px 0 14px;letter-spacing:-.01em;scroll-margin-top:90px;}
.fr-article-body h3{font-size:21px;color:var(--fr-navy);margin:32px 0 10px;}
.fr-article-body p{margin:0 0 20px;}
.fr-article-body img{max-width:100%;height:auto;border-radius:var(--fr-radius);margin:24px 0;}
.fr-article-body a{color:var(--fr-orange);text-decoration:underline;text-underline-offset:2px;}
.fr-article-body ul,.fr-article-body ol{margin:0 0 20px;padding-left:24px;}
.fr-article-body li{margin:0 0 8px;}
.fr-article-body blockquote{border-left:4px solid var(--fr-orange);background:var(--fr-bg-soft);
  margin:24px 0;padding:14px 20px;border-radius:0 8px 8px 0;color:var(--fr-navy);font-style:italic;}

/* sommaire */
.fr-toc{background:var(--fr-bg-soft);border:1px solid var(--fr-border);border-radius:var(--fr-radius);padding:18px 22px;margin:0 0 30px;}
.fr-toc strong{display:block;color:var(--fr-navy);margin-bottom:10px;font-size:14px;text-transform:uppercase;letter-spacing:.04em;}
.fr-toc ul{list-style:none;margin:0;padding:0;}
.fr-toc li{margin:6px 0;}
.fr-toc a{color:var(--fr-text);text-decoration:none;font-size:15px;border-left:2px solid transparent;padding-left:10px;transition:.2s;}
.fr-toc a:hover,.fr-toc a.is-active{color:var(--fr-orange);border-left-color:var(--fr-orange);}

/* CTA location */
.fr-cta-rent{display:flex;gap:18px;align-items:center;border:1.5px solid var(--fr-orange);border-radius:var(--fr-radius);
  padding:22px;margin:40px 0;background:linear-gradient(180deg,var(--fr-orange-soft),#fff);}
.fr-cta-rent__txt{flex:1;}
.fr-cta-rent__txt strong{display:block;color:var(--fr-navy);font-size:19px;margin-bottom:4px;}
.fr-cta-rent__txt span{color:var(--fr-muted);font-size:14px;}
.fr-cta-rent a.btn{background:var(--fr-orange);color:#fff;font-weight:700;padding:13px 22px;border-radius:8px;
  text-decoration:none;white-space:nowrap;transition:.25s var(--fr-ease);}
.fr-cta-rent a.btn:hover{background:var(--fr-orange-hover);transform:translateY(-2px);}

/* articles liés */
.fr-related{margin-top:56px;}
.fr-related h2{font-size:24px;color:var(--fr-navy);margin-bottom:20px;}

/* ---- responsive ---- */
@media(max-width:860px){
  .fr-hero{grid-template-columns:1fr;}
  .fr-hero__media{min-height:220px;}
  .fr-cta-rent{flex-direction:column;align-items:stretch;text-align:center;}
}
@media(prefers-reduced-motion:reduce){
  .fr-card,.fr-card__media img,.fr-hero__cta,.fr-cta-rent a.btn{transition:none!important;transform:none!important;}
}