/* ===========================================================
   VB.com — page /domaintimeline : Domain Timeline since 1985 (#dt)
   Maquette validée le 29/10/2026 (thème clair).
   Toutes les règles sont préfixées .dt pour ne pas interférer
   avec Bootstrap 3 et les styles existants du site.
   =========================================================== */
.dt{
  --dt-bg:#ffffff; --dt-alt:#f7f5f1; --dt-chip:#efece6; --dt-line:#e4e0d8;
  --dt-ink:#1d1b19; --dt-muted:#6f6a63; --dt-red:#b12121; --dt-orange:#e07a2c; --dt-link:#1f5f9e;
  --dt-fd:"Libre Caslon Text",Georgia,"Times New Roman",serif;
  --dt-fb:"Figtree","Segoe UI",Arial,sans-serif;
  max-width:1040px;margin:0 auto;padding:8px 0 40px;text-align:left;
  font:15px/1.55 var(--dt-fb);color:var(--dt-ink);background:var(--dt-bg);
}
.dt *{box-sizing:border-box}
.dt a{color:var(--dt-link)}
.dt a:hover,.dt a:focus{text-decoration:none}
.dt img{max-width:100%;height:auto}
.dt :focus-visible{outline:2px solid var(--dt-orange);outline-offset:2px}
.dt .dt-eyebrow{font:600 12px/1.2 var(--dt-fb);letter-spacing:.14em;text-transform:uppercase;color:var(--dt-orange);margin:0 0 10px}

/* En-tête */
.dt .dt-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center;padding:26px 0 22px}
.dt .dt-hero h1{font:400 42px/1.12 var(--dt-fd);margin:0 0 12px;color:var(--dt-ink)}
.dt .dt-hero h1 b{color:var(--dt-red)}
.dt .dt-sub{margin:0 0 14px;color:var(--dt-muted);font-size:16px;max-width:56ch}
.dt .dt-btns{display:flex;gap:8px;flex-wrap:wrap}
.dt .dt-btn{display:inline-flex;align-items:center;padding:8px 14px;border-radius:999px;border:1px solid var(--dt-line);color:var(--dt-ink);text-decoration:none;font:600 13px/1.2 var(--dt-fb);background:#fff}
.dt .dt-btn:hover,.dt .dt-btn:focus{border-color:var(--dt-red);color:var(--dt-red)}
.dt .dt-btn.dt-dark{background:var(--dt-ink);border-color:var(--dt-ink);color:#fff}
.dt .dt-btn.dt-dark:hover,.dt .dt-btn.dt-dark:focus{background:var(--dt-red);border-color:var(--dt-red);color:#fff}
.dt .dt-logo{display:flex;flex-direction:column;align-items:center;gap:10px}
.dt .dt-logo img{width:140px}
.dt .dt-logo img.dt-tl{width:70px}

/* Chiffres clés */
.dt .dt-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 14px}
.dt .dt-kpi{background:var(--dt-alt);border-radius:12px;padding:14px 16px}
.dt .dt-kpi b{display:block;font:700 26px/1.1 var(--dt-fb);font-variant-numeric:tabular-nums}
.dt .dt-kpi span{font-size:13px;color:var(--dt-muted)}
.dt .dt-kpi.dt-red b{color:var(--dt-red)}

/* Graphique */
.dt .dt-chartbox{background:#fff;border:1px solid var(--dt-line);border-radius:14px;padding:18px 18px 12px;margin:0 0 14px}
.dt .dt-ch-h{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin:0 0 10px}
.dt .dt-ch-h h2{font:400 21px/1.25 var(--dt-fd);margin:0 0 4px;color:var(--dt-ink)}
.dt .dt-ch-h p{margin:0;font-size:13.5px;color:var(--dt-muted);max-width:62ch}
.dt .dt-sw{display:flex;border:1px solid var(--dt-line);border-radius:999px;overflow:hidden;flex:none}
.dt .dt-sw button{border:0;background:transparent;color:var(--dt-muted);font:600 12.5px var(--dt-fb);padding:7px 12px;cursor:pointer}
.dt .dt-sw button[aria-pressed="true"]{background:var(--dt-ink);color:#fff}
.dt .dt-chart{width:100%;height:auto;display:block;min-height:180px}
.dt .dt-chart text{font:600 11px var(--dt-fb);fill:var(--dt-muted)}
.dt .dt-chart .gl{stroke:var(--dt-line)}
.dt .dt-chart .ln{fill:none;stroke:var(--dt-orange);stroke-width:2.5}
.dt .dt-chart .ar{fill:rgba(224,122,44,.12)}
.dt .dt-chart .era{stroke:var(--dt-red);stroke-dasharray:3 3;stroke-width:1}
.dt .dt-chart .eral{fill:var(--dt-red);font-size:10.5px}
.dt .dt-chart circle{fill:#fff;stroke:var(--dt-orange);stroke-width:2;cursor:pointer}
.dt .dt-chart circle.est{stroke-dasharray:2 2}
.dt .dt-chart circle:hover{fill:var(--dt-red);stroke:var(--dt-red)}
.dt .dt-tip{min-height:20px;margin:6px 0 0;font-size:13px}
.dt .dt-tip b{color:var(--dt-red)}

/* Publicité */
.dt .dt-ad{margin:22px 0;padding:10px 0;border-top:1px solid var(--dt-line);border-bottom:1px solid var(--dt-line);text-align:center;min-height:120px}
.dt .dt-ad-l{display:block;font:600 10.5px/1 var(--dt-fb);letter-spacing:.12em;text-transform:uppercase;color:var(--dt-muted);margin:0 0 8px}

/* Tableau */
.dt .dt-tbl{border:1px solid var(--dt-line);border-radius:14px;overflow:hidden}
.dt table{width:100%;border-collapse:collapse;margin:0}
.dt thead th{font:600 12px/1 var(--dt-fb);letter-spacing:.08em;text-transform:uppercase;color:var(--dt-muted);text-align:left;padding:14px 16px;background:var(--dt-alt);border:0;border-bottom:1px solid var(--dt-line)}
.dt thead th.dt-r,.dt td.dt-n{text-align:right}
.dt td{padding:11px 16px;border:0;border-bottom:1px solid var(--dt-line);vertical-align:middle}
.dt tr.dt-y:hover{background:#f3efe6}
.dt td.dt-d{white-space:nowrap}
.dt td.dt-d a{font:400 17px var(--dt-fd);color:var(--dt-ink);text-decoration:none}
.dt td.dt-d a:hover{color:var(--dt-red)}
.dt td.dt-n{font:700 16px var(--dt-fb);font-variant-numeric:tabular-nums;white-space:nowrap}
.dt .dt-est{display:inline-block;margin-right:6px;font:600 10.5px/1 var(--dt-fb);letter-spacing:.06em;text-transform:uppercase;color:var(--dt-orange);border:1px solid currentColor;border-radius:999px;padding:3px 6px;vertical-align:2px}
.dt .dt-g{width:34%}
.dt .dt-gbar{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--dt-muted);font-variant-numeric:tabular-nums}
.dt .dt-gbar i{display:block;flex:none;height:8px;border-radius:4px;background:var(--dt-orange);min-width:2px}
.dt .dt-gbar i.neg{background:var(--dt-red)}
.dt .dt-gbar em{font-style:normal;white-space:nowrap}
.dt tr.dt-era td{background:#fbf6ef;padding:14px 16px}
.dt tr.dt-era b{display:block;font:600 11px/1 var(--dt-fb);letter-spacing:.12em;text-transform:uppercase;color:var(--dt-orange);margin:0 0 5px}
.dt tr.dt-era p{margin:0;font:400 16px/1.4 var(--dt-fd)}

/* HP GE TI */
.dt .dt-three{display:grid;grid-template-columns:auto minmax(0,1fr);gap:24px;align-items:center;margin:40px 0 0;background:var(--dt-alt);border-radius:14px;padding:20px}
.dt .dt-lg{display:flex;gap:10px}
.dt .dt-lg a{display:grid;place-items:center;width:96px;height:58px;border:1px solid var(--dt-line);border-radius:8px;background:#fff}
.dt .dt-lg img{width:80px}
.dt .dt-three p{margin:0;font-size:15px}

/* Texte */
.dt .dt-why{max-width:760px;margin:48px auto 0;display:grid;gap:18px}
.dt .dt-why p{margin:0}
.dt .dt-h2{font:400 30px/1.2 var(--dt-fd);margin:0;color:var(--dt-ink)}
.dt .dt-quote{padding:24px 0;border-top:1px solid var(--dt-line);border-bottom:1px solid var(--dt-line);font:italic 400 26px/1.3 var(--dt-fd);text-align:center;color:var(--dt-red)}
.dt .dt-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.dt .dt-cols div{border:1px solid var(--dt-line);border-radius:12px;padding:14px;font-size:14px}
.dt .dt-cols b{display:block;font:400 22px/1.1 var(--dt-fd);margin-bottom:6px}
.dt .dt-facts{list-style:none;margin:0;padding:0;border-left:2px solid var(--dt-line)}
.dt .dt-facts li{position:relative;padding:0 0 12px 18px;font-size:14.5px}
.dt .dt-facts li::before{content:"";position:absolute;left:-6px;top:6px;width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid var(--dt-orange)}
@media (max-width:760px){
  .dt .dt-hero{grid-template-columns:1fr}.dt .dt-hero h1{font-size:30px}.dt .dt-logo{display:none}
  .dt .dt-kpis,.dt .dt-cols{grid-template-columns:1fr}
  .dt .dt-g{display:none}.dt td{padding:10px 12px}.dt td.dt-d a{font-size:15px}.dt .dt-est{font-size:9px;padding:2px 5px}
  .dt .dt-three{grid-template-columns:1fr}
  .dt .dt-h2{font-size:25px}.dt .dt-quote{font-size:21px}
}
