/* WhichLMS · thème v2 « registre de décision » : pin profond, papier chaud, cuivre pour l'action.
   Chargé après site.css ; mécanique calquée sur le standard 15/09, DA propre à WhichLMS. */

:root{
  --pine:#0c352e; --pine-2:#11473d; --pine-3:#1a5c4f;
  --paper:#f8f5ef; --card:#fffdf8;
  --ink:#1d2a27; --muted:#5d6b66;
  --copper:#c65a19; --copper-dark:#a34410; --copper-soft:#f9e8dc;
  --gold:#d9a441; --gold-soft:#f6ecd4;
  --teal:#166a5d; --teal-ink:#0f4f45; --teal-soft:#e4efeb;
  --line:#e2dccd; --line-soft:#ece7da;
  --shadow:0 20px 44px -26px rgba(12,53,46,.4);
  --radius:14px;
}

body{background:var(--paper);color:var(--ink)}
h1,h2,h3{color:var(--ink)}
h1 em,h2 em{font-style:italic;color:var(--copper)}

/* ----- boutons ----- */
.button{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:10px;
  font-weight:700;font-size:.97rem;text-decoration:none !important;background:var(--copper);color:#fff !important;
  border:2px solid var(--copper);box-shadow:0 10px 22px -12px rgba(198,90,25,.75);transition:transform .12s,background .12s}
.button:hover{background:var(--copper-dark);border-color:var(--copper-dark);transform:translateY(-1px)}
.button-ink{background:var(--pine);border-color:var(--pine);box-shadow:none}
.button-ink:hover{background:var(--pine-2);border-color:var(--pine-2)}
.button-outline{background:transparent;border-color:var(--line);color:var(--ink) !important;box-shadow:none}
.button-outline:hover{background:var(--teal-soft);border-color:var(--teal-soft);transform:none}
.button-small{padding:8px 14px;font-size:.88rem;border-radius:9px}
.button .arr{font-weight:400}

.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:.75rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--copper)}
.eyebrow::before{content:"";width:20px;height:3px;background:var(--copper);border-radius:2px}
.pill{display:inline-flex;align-items:center;font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:5px 11px;border-radius:999px;background:var(--gold-soft);color:#7a5a10}
.pill-teal{background:var(--teal-soft);color:var(--teal-ink)}

/* ----- logos ----- */
.plogo{display:block;width:auto;max-width:100%;object-fit:contain;object-position:left center}
.plogo-box{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;background:#fff;border:1px solid var(--line);border-radius:12px}
.plogo-box.dark{background:#101614;border-color:#101614}
.logo-strip{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;padding:18px 22px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin:1.6rem 0}
.logo-strip .plogo-box{border:none;background:transparent;padding:4px 0}
.logo-strip .plogo-box.dark{background:#101614;padding:6px 12px;border-radius:9px}

/* ----- héros accueil ----- */
.home-hero{background:radial-gradient(1100px 620px at 82% -20%,var(--pine-3) 0%,var(--pine-2) 42%,var(--pine) 100%);color:#fff;padding:58px 0 64px;margin:0 0 1rem}
.home-hero .wrap{display:grid;grid-template-columns:1.06fr .94fr;gap:52px;align-items:center}
.home-hero h1{color:#fff;max-width:20ch;margin:14px 0 16px}
.home-hero h1 em{color:var(--gold)}
.home-hero .lede{color:#cfe0d9;font-size:1.13rem;max-width:54ch}
.home-hero .eyebrow{color:var(--gold)}.home-hero .eyebrow::before{background:var(--gold)}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px;align-items:center}
.hero-actions .button-outline{border-color:rgba(255,255,255,.4);color:#fff !important}
.hero-actions .button-outline:hover{background:rgba(255,255,255,.09);border-color:#fff}
.hero-note{margin-top:20px;font-size:.85rem;color:#9fb8ae}

.pick-stack{display:grid;gap:12px}
.pick{display:flex;flex-direction:column;gap:7px;background:#fff;border-radius:var(--radius);padding:15px 18px 16px;box-shadow:var(--shadow)}
.pick .p-top{display:flex;justify-content:space-between;align-items:center;gap:14px}
.pick .plogo-box{padding:2px 0;border:none;background:transparent}
.pick .plogo-box.dark{background:#101614;border-radius:8px;padding:6px 10px}
.pick-label{font-size:.72rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--copper);margin:0}
.pick-why{font-size:.88rem;line-height:1.45;color:var(--muted);margin:0}
.pick .p-bottom{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:4px}
.pick-price{font-size:.85rem;font-weight:700;color:var(--ink);white-space:nowrap;margin:0}
.pick .button-small{white-space:nowrap}

/* ----- tableau d'ensemble (glance) ----- */
.glance td .plogo-box{padding:6px 10px}
.glance td.actions{white-space:nowrap}
.glance .from{font-variant-numeric:tabular-nums;font-weight:700}

/* ----- parcours illustrés ----- */
.journeys{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin:1.6rem 0}
.journey{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;text-decoration:none !important;color:var(--ink);transition:transform .14s,box-shadow .14s}
.journey:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.journey img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-bottom:1px solid var(--line-soft)}
.journey .j-body{padding:14px 16px 16px}
.journey h3{margin:0 0 6px;font-size:1.05rem}
.journey p{margin:0;font-size:.88rem;color:var(--muted)}
.journey .j-go{margin-top:10px;font-weight:700;color:var(--copper);font-size:.9rem}

/* ----- galeries ----- */
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin:1.6rem 0}
.shot{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.shot img{width:100%;display:block;border-bottom:1px solid var(--line-soft)}
.shot figcaption{padding:11px 14px;font-size:.84rem;color:var(--muted)}

/* ----- bandeau In this guide ----- */
.guide-strip{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:12px;padding:14px 18px;margin:1.4rem 0 2rem}
.guide-strip .gs-label{font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-right:4px}
.guide-item{display:inline-flex;align-items:center;gap:10px}
.guide-item .plogo-box{padding:6px 10px}
.guide-item .button-small{padding:6px 11px}

/* ----- duel comparatif ----- */
.vs-hero{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:.4rem 0 1rem}
.vs-hero .plogo-box{padding:12px 18px}
.vs-hero .vs-mark{font-family:var(--serif);font-style:italic;font-weight:700;font-size:1.3rem;color:var(--copper)}
.verdict-duo{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:1.6rem 0}
.verdict{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;display:flex;flex-direction:column;gap:10px}
.verdict.lead{border-color:var(--teal);box-shadow:var(--shadow)}
.verdict .v-tag{font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--teal-ink)}
.verdict.lead .v-tag{color:var(--copper)}
.verdict p{margin:0;font-size:.93rem;color:var(--muted)}
.verdict .button{align-self:flex-start;margin-top:6px}

/* ----- fiche plateforme ----- */
.platform-hero{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center;background:linear-gradient(140deg,var(--card) 0%,var(--teal-soft) 130%);border:1px solid var(--line);border-radius:var(--radius);padding:30px 34px;margin:1.2rem 0 2rem}
.platform-hero .ph-meta{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.platform-hero .ph-tagline{font-size:1.06rem;color:var(--ink);max-width:44ch}
.platform-hero .ph-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px;align-items:center}
.platform-hero img.ph-shot{width:100%;border-radius:10px;border:1px solid var(--line);box-shadow:var(--shadow)}
.fit-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:1.5rem 0}
.fit{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px}
.fit h3{margin:0 0 10px;font-size:1rem}
.fit.pro h3{color:var(--teal-ink)}.fit.con h3{color:var(--copper-dark)}
.fit ul{margin:0;padding-left:1.1rem}
.fit li{font-size:.93rem;margin-bottom:.45rem}
.cta-box{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;background:var(--pine);color:#fff;border-radius:var(--radius);padding:24px 28px;margin:2rem 0}
.cta-box .cb-text{max-width:52ch}
.cta-box h3{color:#fff;margin:0 0 4px}
.cta-box p{color:#cfe0d9;margin:0;font-size:.92rem}
.sticky-bar{display:none}
@media (max-width:760px){
  .sticky-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--line);
    padding:10px 14px;align-items:center;justify-content:space-between;gap:12px;box-shadow:0 -8px 24px -18px rgba(12,53,46,.5)}
  .sticky-bar .sb-name{font-weight:800;font-size:.95rem}
  body.has-sticky{padding-bottom:64px}
}

/* ----- mention d'affiliation ----- */
.mention{font-size:.8rem;color:var(--muted);margin:.6rem 0 0;max-width:60ch}

/* ----- cartes / hubs (reprend les .card existantes) ----- */
.card{border-radius:var(--radius)}
.card:hover{box-shadow:var(--shadow);border-color:var(--line)}

/* ----- pied de page 4 colonnes ----- */
.footer-grid{grid-template-columns:1.6fr 1fr 1fr 1fr}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr}}

/* ----- responsive héros ----- */
@media (max-width:900px){
  .home-hero .wrap{grid-template-columns:1fr;gap:30px}
  .platform-hero{grid-template-columns:1fr;padding:22px}
  .verdict-duo,.fit-grid{grid-template-columns:1fr}
}

/* ----- l'answer garde le style éditorial mais s'accorde au thème ----- */
.answer{border-left-color:var(--copper);background:var(--card)}
.kicker{color:var(--teal-ink)}
.site-header{border-top-color:var(--copper)}
.wordmark span{color:var(--copper)}
.cta{background:var(--copper);border-radius:10px}
.cta:hover,.cta:focus{background:var(--copper-dark)}
.cta.ghost{color:var(--copper-dark) !important;border-color:var(--copper)}
.cta.ghost:hover{background:var(--copper-soft)}
thead th{background:var(--teal-soft);color:var(--teal-ink)}
.tool{border-radius:var(--radius)}
.foot-transparency{max-width:92ch;margin:0 0 .6rem;line-height:1.55}
.foot-base a{color:inherit;text-decoration:underline}

/* ----- visuels générés par IA (standard whichfunnel du 30/09/2026) ----- */
.editorial-figure{margin:18px 0 26px;border-radius:var(--radius);overflow:hidden;background:var(--card);box-shadow:var(--shadow);border:1px solid var(--line-soft)}
.editorial-figure img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.editorial-figure figcaption{padding:8px 14px;font-size:12.5px;color:var(--muted);background:var(--card)}
.home-editorial{padding:8px 0 4px}.home-editorial .editorial-figure{margin:0}
.home-editorial .editorial-figure img{aspect-ratio:21/8}
@media(min-width:760px){.page .editorial-figure img{aspect-ratio:21/9}}
