/* Tokens de design da marca UMACASAPRAMIM (Premium Imobiliária).
   Cores derivadas do logo. Estilo aprovado pelo cliente em 2026-05-19. */
:root {
  /* === Cores da marca === */
  --navy:    #0D2B6B;   /* azul-marinho principal — texto, botões, gradientes */
  --navy-2:  #081D4D;   /* navy escuro — hover, footer */
  --navy-3:  #14418F;   /* navy claro — gradientes */
  --yellow:  #F7C73D;   /* amarelo da casinha — acento de destaque */
  --yellow-2:#FFD45A;   /* amarelo claro — hover de botão amarelo */
  --sky:     #2BC4F0;   /* azul claro lateral — acento secundário */
  --pink:    #E83A6A;   /* rosa — palavras em destaque, tags */
  --green:   #2BA84A;   /* verde — só WhatsApp */

  /* === Texto e fundo === */
  --ink:     #0D2B6B;   /* texto principal = navy */
  --ink-2:   #374466;
  --muted:   #6B7388;
  --line:    #E8ECF2;
  --bg:      #FFFFFF;
  --bg-soft: #F6F8FC;   /* faixa alternada — branco azulado */
  --danger:  #D9333F;
  --success: #2BA84A;

  /* === Tipografia === */
  --font-body: 'Manrope', -apple-system, system-ui, 'Segoe UI', sans-serif;

  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-base: 15px;
  --fs-md: 17px;
  --fs-lg: 20px;
  --fs-xl: 24px;
  --fs-2xl: 32px;
  --fs-3xl: clamp(26px, 5vw, 52px);
  --fs-hero: clamp(30px, 6.5vw, 76px);

  /* === Espaçamento (base 4) === */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px; --sp-9: 96px;
  --sp-10: 120px;

  /* === Raios === */
  --r-sm:   8px;
  --r:     14px;
  --r-md:  18px;
  --r-lg:  24px;
  --r-pill: 999px;

  /* === Sombras === */
  --sh-1: 0 1px 0 var(--line);
  --sh-2: 0 8px 24px rgba(13, 43, 107, 0.08);
  --sh-3: 0 20px 40px -20px rgba(13, 43, 107, 0.18);
  --sh-4: 0 30px 60px -30px rgba(13, 43, 107, 0.28);
  --sh-fab: 0 8px 24px rgba(43, 168, 74, 0.35);

  /* === Layout === */
  --container: 1240px;
  --header-h: 80px;
  --topstrip-h: 4px;
  --bottomnav-h: 64px;

  --ease: cubic-bezier(.2,.7,.2,1);

  /* === Selo da marca (faixa colorida do topo / footer) === */
  --brand-strip: linear-gradient(90deg,
    var(--yellow) 0%, var(--yellow) 33%,
    var(--sky) 33%,    var(--sky) 66%,
    var(--pink) 66%,   var(--pink) 100%);
}