/* ============================================================
   P.YOUNG — PREVIEW / REDESIGN 2026
   Design tokens — fundação compartilhada pelas 4 superfícies
   (site, admin, painel do cliente, app iOS)
   ============================================================ */

:root{
  /* ---------- cor: ancoragem de marca ---------- */
  --ink:#0B173F;           /* texto/títulos — a tinta do logotipo */
  --ink-soft:#233257;
  --navy-deep:#060D24;      /* superfícies escuras (sidebar, faixas) */
  --navy-panel:#0E1B42;
  --navy-panel-2:#132650;

  --blue:#00B5CC;           /* ação primária — a mesma cor da bolinha do logotipo */
  --blue-deep:#00879A;
  --blue-soft:#E1F8FB;
  --blue-soft-2:#B8EEF4;

  --cyan:#00B5CC;           /* o ponto do logotipo — assinatura, use com parcimônia */
  --cyan-soft:#E1F8FB;
  --cyan-glow:rgba(0,181,204,.5);

  --green:#0FB77B;
  --green-soft:#E7F9F1;
  --amber:#F9B61B;
  --amber-soft:#FFF6DE;
  --red:#E5484D;
  --red-soft:#FDEAEB;

  /* ---------- cor: neutros ---------- */
  --paper:#F5F7FC;
  --surface:#FFFFFF;
  --surface-alt:#FBFCFE;
  --line:#E3E8F5;
  --line-soft:#EEF1F9;
  --muted:#5A6785;
  --muted-2:#8A93A8;
  --white:#FFFFFF;

  /* ---------- tipografia ---------- */
  --font-display:"Plus Jakarta Sans","Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-body:"Inter","Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-mono:"IBM Plex Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace;
  --font-serif:"Fraunces","Iowan Old Style","Georgia",serif;

  --fs-display-xl:clamp(2.6rem,4.6vw + 1rem,4.6rem);
  --fs-display-lg:clamp(2.1rem,3vw + 1rem,3.2rem);
  --fs-display-md:clamp(1.6rem,1.6vw + 1rem,2.15rem);
  --fs-heading-lg:1.5rem;
  --fs-heading-md:1.25rem;
  --fs-heading-sm:1.05rem;
  --fs-body-lg:1.125rem;
  --fs-body-md:1rem;
  --fs-body-sm:.9rem;
  --fs-label:.8rem;
  --fs-caption:.75rem;
  --fs-micro:.6875rem;

  /* ---------- espaçamento ---------- */
  --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;

  /* ---------- forma ---------- */
  --r-xs:8px; --r-sm:12px; --r-md:16px; --r-lg:22px; --r-xl:28px; --r-2xl:36px; --r-pill:999px;

  /* ---------- sombra (camadas: contato + difusão, mais crível que um único blur) ---------- */
  --sh-xs:0 1px 1px rgba(10,20,50,.03),0 2px 4px rgba(10,20,50,.05);
  --sh-sm:0 1px 2px rgba(10,20,50,.05),0 6px 16px rgba(10,20,50,.07);
  --sh-md:0 2px 6px rgba(10,20,50,.05),0 18px 40px rgba(10,20,50,.10);
  --sh-lg:0 8px 16px rgba(6,13,36,.10),0 32px 72px rgba(6,13,36,.18);
  --sh-blue:0 2px 6px rgba(0,181,204,.16),0 16px 32px rgba(0,181,204,.26);
  --sh-cyan:0 0 0 4px rgba(0,181,204,.14),0 8px 20px rgba(0,181,204,.28);
  --ring:0 0 0 4px var(--blue-soft);
  --border-soft:1px solid rgba(11,23,63,.08);

  /* ---------- layout ---------- */
  --container:1240px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --dur-fast:150ms;
  --dur-med:260ms;
  --dur-slow:440ms;
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
}