/* ==========================================================================
   PORTALIS — Base : reset, typographie, boutons, liens, étiquette "article"
   ========================================================================== */

*,*::before,*::after{box-sizing:border-box}

html{
  background:var(--portalis-graph);
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--portalis-hdr-m) + env(safe-area-inset-top,0px) + 10px);
  -webkit-text-size-adjust:100%;
}

section[id]{scroll-margin-top:calc(var(--portalis-hdr-m) + env(safe-area-inset-top,0px) + 10px)}
body{
  margin:0;
  background:var(--bs-body-bg);
  color:var(--bs-body-color);
  font:400 1.0625rem/1.65 var(--portalis-font-sans);
  -webkit-font-smoothing:antialiased;
}
[hidden]{display:none!important}
img,svg{max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--portalis-accent);outline-offset:3px}

/* Keep Bootstrap's container aligned with the reference layout. Bootstrap's
   default 1320px max-width at >=1400px makes the page noticeably too wide. */
.container{
  --bs-gutter-x:0px;
  width:min(1180px, calc(100% - (2 * var(--portalis-gut))));
  max-width:none;
  padding-right:0;
  padding-left:0;
}

h1,h2,h3,h4{font-family:var(--portalis-font-display);font-weight:700;letter-spacing:-.015em;text-wrap:balance}

.todo{border-bottom:1px dashed currentColor;white-space:nowrap;opacity:.8}
.ledger{background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0,rgba(255,255,255,.05) 1px,transparent 1px,transparent 96px)}

/* Étiquette "article" — numérotation empruntée au vocabulaire juridique (Art. 01, Art. 02…) */
.eyebrow{font:500 .8rem/1 var(--portalis-font-mono);letter-spacing:.06em;color:var(--portalis-accent)}
.eyebrow .n{color:var(--portalis-ink-3)}
[data-bs-theme="dark"] .eyebrow{color:var(--portalis-accent-2)}
[data-bs-theme="dark"] .eyebrow .n{color:var(--portalis-on-dark-2)}

/* ============ Boutons (surchargent le .btn de Bootstrap, mêmes classes) ============ */
.btn{
  font:600 .82rem/1 var(--portalis-font-mono);letter-spacing:.05em;text-transform:uppercase;
  text-decoration:none;cursor:pointer;
  background:transparent;color:var(--portalis-ink);
  border:1px solid var(--portalis-ink);border-radius:var(--portalis-radius);
  transition:background-color .15s,color .15s,border-color .15s;
}
.btn:hover{background:var(--portalis-ink);color:var(--portalis-paper)}
.btn.primary{background:var(--portalis-ink);color:var(--portalis-paper)}
.btn.primary:hover{background:var(--portalis-accent);border-color:var(--portalis-accent);color:#fff}
[data-bs-theme="dark"] .btn{border-color:var(--portalis-on-dark);color:var(--portalis-on-dark)}
[data-bs-theme="dark"] .btn:hover{background:var(--portalis-on-dark);color:var(--portalis-graph)}
[data-bs-theme="dark"] .btn.primary{background:var(--portalis-on-dark);color:var(--portalis-graph)}
[data-bs-theme="dark"] .btn.primary:hover{background:var(--portalis-accent-2);border-color:var(--portalis-accent-2);color:#0c1420}

.link{text-decoration:none;font-weight:600;color:var(--portalis-ink);border-bottom:1px solid var(--portalis-line-strong)}
.link:hover{color:var(--portalis-accent);border-color:var(--portalis-accent)}
[data-bs-theme="dark"] .link{color:var(--portalis-on-dark);border-color:var(--portalis-line-dark)}
[data-bs-theme="dark"] .link:hover{color:var(--portalis-accent-2);border-color:var(--portalis-accent-2)}

.ico{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* Titres et intros de section, communs à tout le site */
.sec-title{font-size:clamp(1.9rem,3.2vw,2.7rem);line-height:1.12;letter-spacing:-.015em;color:var(--bs-heading-color)}
.sec-lead{max-width:54ch;color:var(--portalis-ink-2)}
[data-bs-theme="dark"] .sec-lead{color:var(--portalis-on-dark-2)}

/* Keep the reference section rhythm while retaining Bootstrap utilities in
   the templates. */
.sec{padding-top:clamp(56px, 8vw, 110px)!important;padding-bottom:clamp(56px, 8vw, 110px)!important}
