/* ═══════════════════════════════════════════════════
   bootstrap-style.css
   Ponte entre o Bootstrap e a identidade compartilhada.
   Componentes, tokens e efeitos ficam em portfolio.css;
   aqui só o que o Bootstrap precisa para ficar igual à versão Tailwind.
═══════════════════════════════════════════════════ */

/* ─── TOKENS DO BOOTSTRAP — LIGHT ─── */
:root, [data-bs-theme="light"] {
  --bs-body-bg: #F0EDE4;
  --bs-body-bg-rgb: 240, 237, 228;
  --bs-body-color: #1A1E14;
  --bs-heading-color: #1A1E14;
  --bs-secondary-color: #3D4234;
  --bs-tertiary-color: #7A7870;

  --bs-primary: #1A7A40;
  --bs-primary-rgb: 26, 122, 64;

  --bs-secondary-bg: #E8E4D8;
  --bs-tertiary-bg: #DEDAD0;

  --bs-border-color: rgba(26, 30, 20, 0.08);
  --bs-border-color-translucent: rgba(26, 30, 20, 0.14);
}

/* ─── TOKENS DO BOOTSTRAP — DARK ─── */
[data-bs-theme="dark"] {
  --bs-body-bg: #0D1A12;
  --bs-body-bg-rgb: 13, 26, 18;
  --bs-body-color: #EDE8DC;
  --bs-heading-color: #EDE8DC;
  --bs-secondary-color: #C8C2B4;
  --bs-tertiary-color: #7A7670;

  --bs-primary: #5FE89A;
  --bs-primary-rgb: 95, 232, 154;

  --bs-secondary-bg: #162010;
  --bs-tertiary-bg: #1E2E1A;

  --bs-border-color: rgba(237, 232, 220, 0.07);
  --bs-border-color-translucent: rgba(237, 232, 220, 0.14);
}

body {
  font-family: 'DM Sans', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background-color .3s, color .3s;
}

/* ─── CONTAINER — mesmo da versão Tailwind (1140px, 24/40px) ─── */
.page-container {
  width: 100%;
  max-width: 1140px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}

@media (min-width: 768px) {
  .page-container { padding-inline: 2.5rem; }
}

@media (min-width: 992px) {
  .gx-lg-6 { --bs-gutter-x: 5rem; }
}

/* ─── UTILITÁRIOS — espelham as classes Tailwind ─── */
.font-mono { font-family: 'JetBrains Mono', monospace; }

.fs-display    { font-size: var(--fs-display); }
.fs-h2         { font-size: var(--fs-h2); }
.fs-h2-lg      { font-size: var(--fs-h2-lg); }
.fs-h3         { font-size: var(--fs-h3); }
.fs-lede       { font-size: var(--fs-lede); }
.fs-copy       { font-size: var(--fs-copy); }
.fs-meta       { font-size: var(--fs-meta); }

.text-cream    { color: rgb(var(--cream)); }
.text-cream-2  { color: rgb(var(--cream-2)); }
.text-cream-3  { color: rgb(var(--cream-3)); }

.tracking-tighter { letter-spacing: -0.05em; }
.tracking-tight   { letter-spacing: -0.025em; }
.tracking-wide    { letter-spacing: 0.025em; }

.lh-tight  { line-height: 1.25; }
.lh-title  { line-height: 1.06; }

.max-w-md  { max-width: 28rem; }
.max-w-lg  { max-width: 32rem; }