/* ============================================================
   Compraí · Design tokens (bundled for the landing site)
   Source of truth: project tokens/*.css — fonts/colors/type/space/base
   ============================================================ */

/* ---- Fonts (servidas pelo Google Fonts no site público; o app self-hospeda) ---- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root {
  /* ---- Brand palette (raw) ---- */
  --green-comprai:#16A75A; --green-deep:#0C4A33; --yellow-sun:#FFC233;
  --coral-vivo:#FF6B57; --cream:#FBF7EF; --graphite:#1B2A24;

  /* ---- Green ramp ---- */
  --green-50:#E7F6EE; --green-100:#C5EAD5; --green-200:#98DAB6; --green-300:#5FC68F;
  --green-400:#16A75A; --green-500:#119250; --green-600:#0E7843; --green-700:#0C603A;
  --green-800:#0C4A33; --green-900:#08301F;

  /* ---- Neutral / cream ramp ---- */
  --cream-50:#FEFDFB; --cream-100:#FBF7EF; --cream-200:#F3ECDF; --cream-300:#E8DECC;
  --sand-400:#D6C9B2; --stone-500:#A99D89; --stone-600:#786F60;
  --ink-700:#42473F; --ink-800:#2A322B; --ink-900:#1B2A24;

  /* ---- Accent ramps ---- */
  --yellow-soft:#FFF2CC; --yellow-400:#FFC233; --yellow-600:#E0A300;
  --coral-soft:#FFE3DD; --coral-400:#FF6B57; --coral-600:#E64B36;

  /* ---- Semantic ---- */
  --surface-bg:var(--cream-100); --surface-card:#FFFFFF; --surface-sunken:var(--cream-200);
  --surface-inverse:var(--green-800); --surface-brand:var(--green-400);
  --text-strong:var(--graphite); --text-body:#2F3A33; --text-muted:var(--stone-600);
  --text-on-brand:#FFFFFF; --text-on-dark:var(--cream-100); --text-link:var(--green-600);
  --border-subtle:var(--cream-300); --border-strong:var(--sand-400); --border-brand:var(--green-400);
  --brand-primary:var(--green-400); --brand-primary-hover:var(--green-500); --brand-primary-press:var(--green-600);
  --brand-on-primary:#FFFFFF;
  --accent-pin:var(--coral-400); --accent-pin-soft:var(--coral-soft);
  --accent-sun:var(--yellow-400); --accent-sun-soft:var(--yellow-soft);
  --success:var(--green-400); --savings:var(--green-500);
  --price-up:var(--coral-600); --price-down:var(--green-500);
  --focus-ring:color-mix(in oklab, var(--green-400) 45%, transparent);

  /* ---- Type ---- */
  --font-display:"Poppins", system-ui, sans-serif;
  --font-body:"Inter", system-ui, sans-serif;
  --fw-light:300; --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-extrabold:800;
  --text-2xs:.6875rem; --text-xs:.75rem; --text-sm:.875rem; --text-md:1rem; --text-lg:1.125rem;
  --text-xl:1.375rem; --text-2xl:1.75rem; --text-3xl:2.25rem; --text-4xl:3rem; --text-5xl:4rem;
  --leading-tight:1.1; --leading-snug:1.25; --leading-normal:1.5; --leading-relaxed:1.65;
  --tracking-tight:-0.02em; --tracking-normal:0; --tracking-wide:.04em; --tracking-label:.12em;

  /* ---- Space / radius / shadow / motion ---- */
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.25rem;
  --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem; --space-12:3rem; --space-16:4rem; --space-20:5rem;
  --radius-xs:6px; --radius-sm:10px; --radius-md:14px; --radius-lg:20px; --radius-xl:28px; --radius-2xl:36px; --radius-pill:999px;
  --shadow-xs:0 1px 2px rgba(12,74,51,.06); --shadow-sm:0 2px 8px rgba(12,74,51,.08);
  --shadow-md:0 6px 18px rgba(12,74,51,.10); --shadow-lg:0 14px 34px rgba(12,74,51,.14);
  --shadow-pin:0 6px 16px rgba(255,107,87,.35);
  --ease-out:cubic-bezier(0.22,1,0.36,1); --ease-in-out:cubic-bezier(0.65,0,0.35,1); --ease-bounce:cubic-bezier(0.34,1.56,0.64,1);
  --dur-fast:120ms; --dur-base:200ms; --dur-slow:320ms;
  --tap-min:44px;
}

/* ---- Base ---- */
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body {
  margin:0; background:var(--surface-bg); color:var(--text-body);
  font-family:var(--font-body); font-size:var(--text-md); line-height:var(--leading-normal);
  font-feature-settings:"tnum" 1,"lnum" 1; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,h5 {
  font-family:var(--font-display); color:var(--text-strong); font-weight:var(--fw-bold);
  line-height:var(--leading-tight); letter-spacing:var(--tracking-tight); margin:0; text-wrap:balance;
}
p { margin:0; text-wrap:pretty; }
a { color:var(--text-link); text-decoration:none; }
button { font-family:inherit; }
img,svg { display:block; max-width:100%; }
.price { font-variant-numeric:tabular-nums lining-nums; font-feature-settings:"tnum" 1,"lnum" 1; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
