/* Gob.bo - Design tokens and institutional styles
   Purpose: provide a small design system layer for colors, typography, buttons and micro-animations.
   Non-invasive: uses CSS variables and utility classes; won't change HTML structure.
*/
:root{
  /* Palette inspired for a Ministry of Cultures / decolonial, accessible */
  --gobbo-primary: #00695c; /* teal-ish, trustworthy */
  --gobbo-primary-700: #004d40;
  --gobbo-accent: #ffb74d; /* warm accent */
  --gobbo-bg: #ffffff;
  --gobbo-muted: #6c757d;
  --gobbo-success: #2e7d32;
  --gobbo-danger: #c62828;

  /* Typography tokens */
  --gobbo-font-sans: 'Montserrat', system-ui, -apple-system, 'Segoe UI', Roboto, "Helvetica Neue", Arial, sans-serif;
  --gobbo-font-heading-weight: 700;
  --gobbo-font-body-weight: 400;

  /* Spacing and sizing */
  --gobbo-radius: 8px;
  --gobbo-btn-padding: 0.65rem 1rem;

  /* Motion */
  --gobbo-ease: cubic-bezier(.2,.9,.3,1);
}

/* Typography defaults - non-destructive */
body { font-family: var(--gobbo-font-sans); color: #222; }
h1,h2,h3,h4,h5 { font-weight: var(--gobbo-font-heading-weight); }

/* Institutional primary button */
.btn-gobbo {
  display: inline-block;
  background: linear-gradient(180deg, var(--gobbo-primary), var(--gobbo-primary-700));
  color: #fff;
  padding: var(--gobbo-btn-padding);
  border-radius: var(--gobbo-radius);
  border: none;
  text-decoration: none;
  font-weight: 600;
  box-shadow: 0 2px 0 rgba(0,0,0,0.06);
  transition: transform 160ms var(--gobbo-ease), box-shadow 160ms var(--gobbo-ease), opacity 160ms var(--gobbo-ease);
}
.btn-gobbo:focus { outline: 3px solid rgba(0,105,92,0.18); outline-offset: 2px; }
.btn-gobbo:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.btn-gobbo[disabled], .btn-gobbo.disabled { opacity: .6; transform: none; box-shadow: none; }

/* Secondary ghost button */
.btn-gobbo--ghost {
  background: transparent; border: 1px solid var(--gobbo-primary); color: var(--gobbo-primary-700); padding: calc(var(--gobbo-btn-padding) - 4px);
}

/* Micro-animations (respect prefers-reduced-motion) */
@media (prefers-reduced-motion: reduce) {
  .btn-gobbo, .btn-gobbo--ghost { transition: none; }
}

/* Small card utility consistent with previous .card-gobbo (enhanced) */
.card-gobbo { background: #fff; border-radius: var(--gobbo-radius); padding: 1rem; box-shadow: 0 6px 18px rgba(0,0,0,0.04); }

/* Accessible focus ring for interactive elements */
.is-focus-visible:focus { outline: 3px solid var(--gobbo-accent); outline-offset: 3px; }

/* Utilities */
.text-muted { color: var(--gobbo-muted); }
.u-flex { display: flex; align-items: center; }
.u-space-between { justify-content: space-between; }

/* Small responsive tweaks for header elements (non-invasive) */
@media (max-width: 991px) {
  .btn-gobbo{ padding: 0.5rem 0.85rem; }
}
