/* ============================================================
   SituLab — situememoring.com — couche d'identité (sur Bootstrap 5.3)
   Souverain : Roboto auto-hébergée, mono système. Palette APCOM + accent or.
   ============================================================ */

@font-face { font-family:"Roboto"; font-weight:300; font-display:swap; src:url("../fonts/roboto-latin-300-normal.woff2") format("woff2"); }
@font-face { font-family:"Roboto"; font-weight:400; font-display:swap; src:url("../fonts/roboto-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family:"Roboto"; font-weight:500; font-display:swap; src:url("../fonts/roboto-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family:"Roboto"; font-weight:700; font-display:swap; src:url("../fonts/roboto-latin-700-normal.woff2") format("woff2"); }

:root {
  --blue:#335A9C; --blue-d:#2A4D85; --navy:#20365C;
  --gold:#D29922; --gold-2:#F2C14E; --gold-ink:#8A6410;
  --ivory:#FAFAF7; --paper:#FFFFFF; --ink:#1A1F2C; --muted:#5A6878; --line:#E6E9EE;
  --mono:"Cascadia Code","JetBrains Mono",Consolas,ui-monospace,monospace;

  /* overrides Bootstrap */
  --bs-primary:#335A9C; --bs-primary-rgb:51,90,156;
  --bs-body-bg:var(--ivory); --bs-body-color:var(--ink);
  --bs-body-font-family:"Roboto",system-ui,-apple-system,"Segoe UI",sans-serif;
  --bs-link-color:var(--blue); --bs-link-hover-color:var(--blue-d);
  --bs-border-color:var(--line);
}

body { font-family:var(--bs-body-font-family); background:var(--ivory); color:var(--ink); -webkit-font-smoothing:antialiased; }
h1,h2,h3,.fw-900 { font-weight:700; letter-spacing:-.01em; }
.lead { color:var(--muted); }
section { scroll-margin-top:72px; }

/* --- Navbar --- */
.nav-sit { background:rgba(250,250,247,.85); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.nav-sit .navbar-brand { font-weight:700; color:var(--ink); display:flex; align-items:center; gap:.55rem; }
.nav-sit .navbar-brand img { width:30px; height:30px; }
.nav-sit .nav-link { color:var(--muted); font-weight:500; }
.nav-sit .nav-link:hover,.nav-sit .nav-link.active { color:var(--ink); }
.brand-lab { color:var(--gold-ink); }

/* --- Boutons --- */
.btn-gold { --bs-btn-bg:var(--gold); --bs-btn-border-color:var(--gold); --bs-btn-color:#2A1E04;
  --bs-btn-hover-bg:var(--gold-2); --bs-btn-hover-border-color:var(--gold-2); --bs-btn-hover-color:#2A1E04;
  --bs-btn-active-bg:var(--gold-2); --bs-btn-font-weight:600; box-shadow:0 2px 10px rgba(210,153,34,.25); }
.btn-outline-ink { --bs-btn-color:var(--ink); --bs-btn-border-color:#C9CED6; --bs-btn-hover-bg:#F0F2F5; --bs-btn-hover-border-color:#AEB4BD; --bs-btn-hover-color:var(--ink); }

/* --- Hero --- */
.hero { padding:5rem 0 4rem; position:relative; overflow:hidden; }
.hero-bg { position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(44rem 30rem at 88% -12%, rgba(242,193,78,.20), transparent 60%),
    radial-gradient(40rem 32rem at -8% 118%, rgba(51,90,156,.13), transparent 60%); }
.hero h1 { font-size:clamp(2.2rem,5.2vw,3.6rem); line-height:1.06; }
.hero .lead { font-size:1.16rem; max-width:34rem; }
.hero-logo { width:92px; height:92px; filter:drop-shadow(0 10px 28px rgba(42,77,133,.22)); }
.hero-eye { display:inline-block; background:#FBF2DC; color:var(--gold-ink);
  border:1px solid #F0E2BD; border-radius:999px; padding:.4rem .85rem; font-weight:600; font-size:.88rem; }
.hero-checks { list-style:none; display:flex; flex-wrap:wrap; gap:.45rem 1.4rem; padding:0; margin:0; font-weight:500; }
.hero-checks li { display:flex; align-items:center; gap:.5rem; }
.hero-checks li::before { content:"✓"; display:inline-grid; place-items:center; width:1.3rem; height:1.3rem;
  border-radius:50%; background:#FBF2DC; color:var(--gold-ink); border:1px solid #F0E2BD; font-size:.78rem; font-weight:700; }
.term-cap { margin:.8rem 0 0; font-size:.9rem; color:var(--muted); text-align:center; }
.hero h1 { font-weight:700; }
.hero h1 .hl { color:var(--blue); }
.hero-sub { font-size:clamp(1.1rem,2vw,1.4rem); font-weight:500; color:var(--ink); max-width:34rem; line-height:1.35; }
.dl-menu { border-color:var(--line); box-shadow:0 12px 30px rgba(32,54,92,.12); }
.dl-menu .dropdown-item { display:flex; justify-content:space-between; align-items:center; gap:1.6rem; padding:.55rem 1rem; }
.dl-ver,.dl-soon { font:600 .74rem/1 var(--mono); color:var(--muted); }
.dl-soon { color:#A9803C; opacity:.9; }
.dl-label { font:600 .78rem/1 var(--mono); letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.eyebrow { font:600 .8rem/1 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--blue); }

/* --- Terminal (voix de marque) --- */
.term { background:#0E1116; border:1px solid #273042; border-radius:12px; padding:16px 18px;
  font-family:var(--mono); font-size:15px; line-height:1.7; color:#C9D4E3; box-shadow:0 14px 40px rgba(20,28,40,.25); }
.term .bar { display:flex; gap:7px; margin-bottom:12px; }
.term .bar i { width:11px; height:11px; border-radius:50%; display:inline-block; }
.term .bar i:nth-child(1){background:#ED6A5E}.term .bar i:nth-child(2){background:#F4BF4F}.term .bar i:nth-child(3){background:#61C554}
.term pre { margin:0; white-space:pre-wrap; font-family:inherit; }
.term .p { color:#E0A82E; font-weight:700; } .term .arg { color:#F2C14E; }
.term .spin { color:#E8B23A; display:inline-block; width:1ch; }
.term .spin::before { content:"⠋"; animation:brl .9s steps(1) infinite; }
@keyframes brl { 0%{content:"⠋"}12%{content:"⠙"}25%{content:"⠹"}37%{content:"⠸"}50%{content:"⠼"}62%{content:"⠴"}75%{content:"⠦"}87%{content:"⠇"}100%{content:"⠏"} }
.term .cur { display:inline-block; width:.6ch; height:1.05em; background:#F2C14E; vertical-align:-2px; margin-left:2px; animation:bk 1.05s steps(1) infinite; }
@keyframes bk { 50%{opacity:0} }
.term .ok { color:#61C554; font-weight:700; }
.term .ar { color:#E8B23A; font-weight:700; }
.term .bar { align-items:center; }
.bar-title { margin-left:.6rem; color:#79838F; font-size:.8rem; font-weight:500; }
/* grand terminal du hero */
.term-hero { font-size:clamp(.98rem,1.5vw,1.15rem); padding:1.5rem 1.8rem 1.75rem; box-shadow:0 26px 64px rgba(16,22,32,.35); }
.term-hero .bar { margin-bottom:1rem; }
.term-hero pre { line-height:1.85; }

/* --- Cartes fonctionnement --- */
.feature { background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:1.6rem 1.5rem; height:100%; transition:transform .15s,box-shadow .15s; }
.feature:hover { transform:translateY(-3px); box-shadow:0 12px 30px rgba(32,54,92,.10); }
.feature .fnum { font:700 .85rem/1 var(--mono); color:var(--gold-ink); background:#FBF2DC; border:1px solid #F0E2BD; border-radius:7px; padding:.35rem .5rem; display:inline-block; margin-bottom:.9rem; }
.feature h3 { font-size:1.12rem; margin-bottom:.4rem; }
.feature p { color:var(--muted); margin:0; font-size:.97rem; }

/* --- Section claire/haute --- */
.band { background:var(--paper); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }

/* --- Tableau versions --- */
.ver-table { font-size:.95rem; }
.ver-table thead th { font:600 .78rem/1 var(--mono); text-transform:uppercase; letter-spacing:.06em; color:var(--muted); border-bottom:2px solid var(--line); }
.ver-table td { vertical-align:middle; }
.ver-table .v { font-family:var(--mono); font-weight:600; color:var(--navy); }
.ver-table tr.latest { background:#FBF6E8; }
.badge-latest { background:var(--gold); color:#2A1E04; font-weight:600; }
.ver-note { color:var(--muted); }

/* --- Footer --- */
.foot { background:#F3F4F6; border-top:1px solid var(--line); color:var(--muted); font-size:.9rem; }
.foot a { color:var(--blue); text-decoration:none; } .foot a:hover { text-decoration:underline; }
.sep-dot::before { content:"·"; margin:0 .5rem; color:#B7BDC6; }

/* --- Dark auto (confort) --- */
@media (prefers-color-scheme: dark) {
  /* la page reste volontairement claire & sobre ; seul le terminal est sombre par nature */
}