/* Clic Óptica — roxo e amarelo (do logo: #6b3d85 e #f0b820)
   Segue as artes do Instagram deles: roxo profundo, amarelo e títulos
   grossos condensados em caixa alta. Primeira ótica com título sem serifa. */
:root {
  --dark: #2e1745;
  --dark-2: #261238;
  --dark-3: #3a1f55;
  --dark-4: #472866;

  --accent: #f5b820;
  --accent-light: #ffd166;
  --accent-em: #f9c02a;
  --accent-strong: #6b3d85;   /* amarelo não tem contraste no branco: no claro o destaque é o roxo */
  --accent-grad: linear-gradient(135deg, #f0b020 0%, #ffd25a 50%, #f0b020 100%);
  --on-accent: #2e1745;

  --light: #faf8fc;
  --light-2: #f0ebf5;

  --text: #22142f;
  --text-soft: #463a52;
  --muted: #6f6479;
  --muted-light: #b9abc8;
  --on-dark-soft: #e6dcef;
  --on-dark-faint: #a493b5;
  --line: rgba(34, 20, 47, 0.1);

  --serif: "Oswald", "Arial Narrow", sans-serif;   /* títulos (o nome da variável é do template) */
  --sans: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  --display-weight: 700;
  --em-style: normal;

  --hero-bg: radial-gradient(120% 80% at 80% 0%, #6b3d85 0%, #2e1745 60%);
  --hero-glow: rgba(245, 184, 32, 0.18);
  --receita-bg: radial-gradient(90% 120% at 0% 100%, #5a3274, var(--dark-2) 60%);
  --stars-on-light: #f0b020;
  --map-filter: grayscale(1) invert(.9) sepia(1) hue-rotate(230deg) saturate(1.6) brightness(.85);

  --logo-h: 50px;
  --logo-h-lg: 64px;
  --logo-footer-h: 80px;
  --logo-sheet-h: 42px;
}

/* Títulos em caixa alta, como nas artes do Instagram */
.hero__title, .section__title { text-transform: uppercase; letter-spacing: .005em; }
/* Oswald não tem itálico: depoimentos e slogan na fonte do texto */
.review blockquote { font-family: var(--sans); font-style: normal; font-size: 15.5px; line-height: 1.65; color: var(--text-soft); }
.footer__brand p { font-family: var(--sans); font-style: normal; font-weight: 600; font-size: 16px; }