/* HeyCupidox design tokens — fonte única para o site público e o painel.
   Camadas: primitivos -> semânticos -> (componentes ficam em cada app). */
:root {
  /* Primitivos: paleta da marca */
  --cream: #faf7f0;
  --cream-deep: #f3ece3;
  --surface-paper: #fffdf9;
  --ink: #332a28;
  --muted: #766861;
  --wine: #842f35;
  --wine-deep: #67232b;
  --terra: #b96347;
  --terra-text: #a04f37;
  --line: #e2d9cf;
  --peach: #f0e4d7;
  --peach-soft: #f8e9df;
  --sage: #47543d;
  --sage-soft: #eef1e7;
  --amber: #694b24;
  --amber-soft: #fff4df;
  --danger-soft: #fae7e4;

  /* Primitivos: tipografia */
  --sans: "DM Sans", sans-serif;
  --display: "Manrope", sans-serif;
  --editorial: Georgia, "Times New Roman", serif;
  --text-2xs: 0.75rem; /* 12px — mínimo permitido no app */
  --text-xs: 0.8125rem;
  --text-sm: 0.875rem;
  --text-md: 1rem;
  --text-lg: 1.1875rem;
  --text-xl: 1.5rem;
  --text-2xl: 2rem;

  /* Primitivos: espaço (base 4) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-14: 56px;
  --content-max: 1180px;
  --reading-max: 680px;
  --page-gutter: 20px;
  --section-space: 56px;
  --header-height: 64px;

  /* Primitivos: forma e movimento */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;
  --shadow-soft: 0 8px 30px #3c251314;
  --shadow-lift: 0 14px 40px #3c251322;
  --ease: cubic-bezier(0.2, 0.7, 0.3, 1);
  --touch: 44px; /* alvo de toque mínimo */

  /* Semânticos */
  --bg: var(--cream);
  --bg-nav: var(--cream-deep);
  --surface: var(--surface-paper);
  --text: var(--ink);
  --text-soft: var(--muted);
  --brand: var(--wine);
  --brand-hover: var(--wine-deep);
  --on-brand: #fff8ee;
  --accent: var(--terra);
  --accent-text: var(--terra-text);
  --border: var(--line);
  --focus: var(--terra);
  --success-bg: var(--sage-soft);
  --success-text: var(--sage);
  --warning-bg: var(--amber-soft);
  --warning-text: var(--amber);
  --danger-bg: var(--danger-soft);
  --danger-text: var(--wine);

  /* Semânticos: visibilidade de gringos */
  --tier-locked: var(--muted);
  --tier-basic: var(--terra-text);
  --tier-full: var(--sage);
  --highlight-night: var(--peach);

  /* Safe areas (PWA) */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

@media (min-width: 700px) {
  :root {
    --page-gutter: 32px;
    --section-space: 88px;
  }
}

@media (min-width: 960px) {
  :root { --header-height: 80px; }
}

/* Shared language dropdown, including its expanded list. */
.language-selector.hc-language {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  width: 68px;
  margin: 0;
  padding: 0;
  font: 500 12px var(--sans, sans-serif);
}
.hc-language .hc-language-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  min-height: 44px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--line, #e2d9cf);
  border-radius: 10px;
  background: transparent;
  color: var(--muted, #766861);
  font: inherit;
  letter-spacing: .04em;
  cursor: pointer;
  box-shadow: none;
}
.hc-language .hc-language-trigger:hover,
.hc-language .hc-language-trigger[aria-expanded="true"] {
  background: var(--peach, #f0e4d7);
  color: var(--wine, #842f35);
}
.hc-language .hc-language-menu {
  position: absolute;
  z-index: 100;
  top: calc(100% + 8px);
  right: 0;
  width: 184px;
  max-width: calc(100vw - 32px);
  max-height: min(320px, 60vh);
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--line, #e2d9cf);
  border-radius: 14px;
  background: var(--cream, #faf7f0);
  box-shadow: 0 8px 28px #332a281a;
}
.hc-language .hc-language-menu[hidden] { display: none; }
.hc-language .hc-language-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 10px 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ink, #332a28);
  font: 400 14px var(--sans, sans-serif);
  line-height: 1.4;
  text-align: left;
  cursor: pointer;
  box-shadow: none;
}
.hc-language .hc-language-option[aria-checked="true"] {
  color: var(--wine, #842f35);
  font-weight: 600;
}
.hc-language .hc-language-option[aria-checked="true"]::after { content: "✓"; }
.hc-language .hc-language-option:hover,
.hc-language .hc-language-option:focus {
  background: var(--peach, #f0e4d7);
  color: var(--wine, #842f35);
}
.hc-language .hc-language-trigger:focus-visible,
.hc-language .hc-language-option:focus-visible {
  outline: 2px solid var(--wine, #842f35);
  outline-offset: 2px;
}
@media (max-width: 1199px) {
  .sh-nav .hc-language-menu { left: 0; right: auto; }
}