/* ============================================================
   SISTEMA ÁUREO — Olli Designer
   Escalas derivadas da sequência de Fibonacci e de φ = 1,618.
   ============================================================ */
:root {
  --phi: 1.6180339887;
  --fib-5: 5px;
  --fib-8: 8px;
  --fib-13: 13px;
  --fib-21: 21px;
  --fib-34: 34px;
  --fib-55: 55px;
  --fib-89: 89px;
  --olli-red: #d62828;
  --olli-ink: #141414;

  /* Escala tipográfica áurea (clamp p/ responsivo) */
  --fs-xs: clamp(12px, 1.2vw, 13px);
  --fs-sm: clamp(14px, 1.6vw, 16px);
  --fs-md: clamp(18px, 2.1vw, 21px);
  --fs-lg: clamp(28px, 3.4vw, 34px);
  --fs-xl: clamp(44px, 5.5vw, 55px);
  --fs-2xl: clamp(68px, 8.9vw, 89px);
}

/* ---------- marca ---------- */
.olli-brand { display: inline-flex; align-items: center; gap: var(--fib-13); text-decoration: none; }
.olli-brand img { height: var(--fib-34); width: auto; display: block; }
.olli-brand .olli-word { display: flex; flex-direction: column; line-height: 1.1; }
.olli-brand .olli-word strong { font-size: var(--fs-md); letter-spacing: .21em; font-weight: 800; }
.olli-brand .olli-word span { font-size: var(--fs-xs); letter-spacing: .34em; opacity: .75; }

/* ---------- hero em proporção áurea ---------- */
.fib-hero { display: grid; grid-template-columns: 1fr 1.618fr; gap: var(--fib-34); align-items: center; }
@media (max-width: 860px) { .fib-hero { grid-template-columns: 1fr; } }

/* ---------- seções ---------- */
.fib-section { padding: var(--fib-89) var(--fib-34); }
.fib-section > h2 { font-size: var(--fs-xl); margin-bottom: var(--fib-21); }
.fib-section > p.lead { font-size: var(--fs-md); margin-bottom: var(--fib-34); max-width: 34em; }

/* ---------- cartões ---------- */
.fib-card { padding: var(--fib-21); border-radius: var(--fib-13); }
.fib-grid { display: grid; gap: var(--fib-21); }