/* ==========================================================================
   Due Guidebook — folha de estilo nativa (parte 2: cores, texto e efeitos)
   --------------------------------------------------------------------------
   Correções de consistência aplicadas aqui, sem tocar no HTML:

   1. UMA escala de cinza. O projeto misturava `slate` (frio) e `gray`
      (neutro) nas mesmas telas. As duas famílias agora apontam para os mesmos
      valores frios — as ~375 ocorrências de `gray-*` deixam de destoar.

   2. UM roxo. O `purple` do framework anterior era violeta e brigava com o
      magenta da marca (#db19ff). A escala foi reancorada no magenta, então
      `bg-purple-100`, `text-purple-700` etc. passam a ser tons da própria
      marca.
   ========================================================================== */

/* ---------- Texto: família, tamanho, peso ------------------------------- */
.font-outfit{font-family:Outfit,ui-sans-serif,system-ui,sans-serif}
.font-sans{font-family:Inter,ui-sans-serif,system-ui,sans-serif}
.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}

.text-\[9px\]{font-size:9px;line-height:1.2}
.text-\[10px\]{font-size:10px;line-height:1.3}
.text-\[11px\]{font-size:11px;line-height:1.35}
.text-\[13px\]{font-size:13px;line-height:1.45}
.text-xs{font-size:.75rem;line-height:1rem}
.text-sm{font-size:.875rem;line-height:1.25rem}
.text-base{font-size:1rem;line-height:1.5rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-4xl{font-size:2.25rem;line-height:2.5rem}
.text-5xl{font-size:3rem;line-height:1.1}
.text-6xl{font-size:3.75rem;line-height:1.05}
.text-7xl{font-size:4.5rem;line-height:1}

.font-thin{font-weight:100} .font-light{font-weight:300} .font-normal{font-weight:400}
.font-medium{font-weight:500} .font-semibold{font-weight:600} .font-bold{font-weight:700}
.font-extrabold{font-weight:800} .font-black{font-weight:900}

.italic{font-style:italic} .not-italic{font-style:normal}
.uppercase{text-transform:uppercase} .lowercase{text-transform:lowercase}
.capitalize{text-transform:capitalize} .normal-case{text-transform:none}
.underline{text-decoration-line:underline} .line-through{text-decoration-line:line-through}
.no-underline{text-decoration-line:none}

.text-left{text-align:left} .text-center{text-align:center}
.text-right{text-align:right} .text-justify{text-align:justify}

.leading-none{line-height:1} .leading-tight{line-height:1.25} .leading-snug{line-height:1.375}
.leading-normal{line-height:1.5} .leading-relaxed{line-height:1.625} .leading-loose{line-height:2}
.leading-\[1\.05\]{line-height:1.05}

.tracking-tighter{letter-spacing:-.05em} .tracking-tight{letter-spacing:-.025em}
.tracking-normal{letter-spacing:0} .tracking-wide{letter-spacing:.025em}
.tracking-wider{letter-spacing:.05em} .tracking-widest{letter-spacing:.1em}
.tracking-\[0\.2em\]{letter-spacing:.2em} .tracking-\[0\.5em\]{letter-spacing:.5em}

/* ---------- Cores: geração das utilitárias ------------------------------
   Cada família tem os tons realmente usados no projeto. Nomes de família
   mantidos para não exigir alteração do HTML; os VALORES é que foram
   unificados (ver cabeçalho).                                              */

/* Marca */
.text-brand-purple{color:var(--brand-purple)} .bg-brand-purple{background-color:var(--brand-purple)}
.border-brand-purple{border-color:var(--brand-purple)}
.text-brand-dark{color:var(--brand-dark)} .bg-brand-dark{background-color:var(--brand-dark)}
.text-brand-grey{color:var(--brand-grey)}
.bg-brand-gradient{background-image:linear-gradient(135deg,#db19ff 0%,#a000c8 100%)}

/* Neutros */
.text-white{color:#fff} .bg-white{background-color:#fff} .border-white{border-color:#fff}
.text-black{color:#000} .bg-black{background-color:#000}
.bg-transparent{background-color:transparent} .text-transparent{color:transparent}
.border-transparent{border-color:transparent}
.text-current{color:currentColor} .bg-current{background-color:currentColor}
.text-inherit{color:inherit}

.text-slate-50{color:var(--slate-50)} .text-slate-100{color:var(--slate-100)}
.text-slate-200{color:var(--slate-200)} .text-slate-300{color:var(--slate-300)}
.text-slate-400{color:var(--slate-400)} .text-slate-500{color:var(--slate-500)}
.text-slate-600{color:var(--slate-600)} .text-slate-700{color:var(--slate-700)}
.text-slate-800{color:var(--slate-800)} .text-slate-900{color:var(--slate-900)}
.bg-slate-50{background-color:var(--slate-50)} .bg-slate-100{background-color:var(--slate-100)}
.bg-slate-200{background-color:var(--slate-200)} .bg-slate-300{background-color:var(--slate-300)}
.bg-slate-400{background-color:var(--slate-400)} .bg-slate-500{background-color:var(--slate-500)}
.bg-slate-600{background-color:var(--slate-600)} .bg-slate-700{background-color:var(--slate-700)}
.bg-slate-800{background-color:var(--slate-800)} .bg-slate-900{background-color:var(--slate-900)}
.border-slate-50{border-color:var(--slate-50)} .border-slate-100{border-color:var(--slate-100)}
.border-slate-200{border-color:var(--slate-200)} .border-slate-300{border-color:var(--slate-300)}
.border-slate-700{border-color:var(--slate-700)} .border-slate-800{border-color:var(--slate-800)}

/* gray-* aponta para os mesmos valores de slate-* — ver correção 1 */
.text-gray-50{color:var(--gray-50)} .text-gray-100{color:var(--gray-100)}
.text-gray-200{color:var(--gray-200)} .text-gray-300{color:var(--gray-300)}
.text-gray-400{color:var(--gray-400)} .text-gray-500{color:var(--gray-500)}
.text-gray-600{color:var(--gray-600)} .text-gray-700{color:var(--gray-700)}
.text-gray-800{color:var(--gray-800)} .text-gray-900{color:var(--gray-900)}
.bg-gray-50{background-color:var(--gray-50)} .bg-gray-100{background-color:var(--gray-100)}
.bg-gray-200{background-color:var(--gray-200)} .bg-gray-300{background-color:var(--gray-300)}
.bg-gray-400{background-color:var(--gray-400)} .bg-gray-500{background-color:var(--gray-500)}
.bg-gray-600{background-color:var(--gray-600)} .bg-gray-700{background-color:var(--gray-700)}
.bg-gray-800{background-color:var(--gray-800)} .bg-gray-900{background-color:var(--gray-900)}
.border-gray-50{border-color:var(--gray-50)} .border-gray-100{border-color:var(--gray-100)}
.border-gray-200{border-color:var(--gray-200)} .border-gray-300{border-color:var(--gray-300)}
.border-gray-400{border-color:var(--gray-400)} .border-gray-700{border-color:var(--gray-700)}
.border-gray-800{border-color:var(--gray-800)}

.text-purple-50{color:var(--purple-50)} .text-purple-100{color:var(--purple-100)}
.text-purple-200{color:var(--purple-200)} .text-purple-300{color:var(--purple-300)}
.text-purple-400{color:var(--purple-400)} .text-purple-500{color:var(--purple-500)}
.text-purple-600{color:var(--purple-600)} .text-purple-700{color:var(--purple-700)}
.text-purple-800{color:var(--purple-800)} .text-purple-900{color:var(--purple-900)}
.bg-purple-50{background-color:var(--purple-50)} .bg-purple-100{background-color:var(--purple-100)}
.bg-purple-200{background-color:var(--purple-200)} .bg-purple-300{background-color:var(--purple-300)}
.bg-purple-400{background-color:var(--purple-400)} .bg-purple-500{background-color:var(--purple-500)}
.bg-purple-600{background-color:var(--purple-600)} .bg-purple-700{background-color:var(--purple-700)}
.bg-purple-800{background-color:var(--purple-800)} .bg-purple-900{background-color:var(--purple-900)}
.border-purple-100{border-color:var(--purple-100)} .border-purple-200{border-color:var(--purple-200)}
.border-purple-300{border-color:var(--purple-300)} .border-purple-500{border-color:var(--purple-500)}

.text-violet-600{color:var(--violet-600)} .bg-violet-50{background-color:var(--violet-50)}
.bg-violet-100{background-color:var(--violet-100)} .bg-violet-600{background-color:var(--violet-600)}
.text-fuchsia-500{color:var(--fuchsia-500)} .bg-fuchsia-500{background-color:var(--fuchsia-500)}
.text-pink-500{color:var(--pink-500)} .bg-pink-500{background-color:var(--pink-500)}
.text-rose-500{color:var(--rose-500)} .bg-rose-500{background-color:var(--rose-500)}

.text-red-400{color:var(--red-400)} .text-red-500{color:var(--red-500)} .text-red-600{color:var(--red-600)}
.text-red-700{color:var(--red-700)} .text-red-800{color:var(--red-800)} .text-red-900{color:var(--red-900)}
.bg-red-50{background-color:var(--red-50)} .bg-red-100{background-color:var(--red-100)}
.bg-red-200{background-color:var(--red-200)} .bg-red-400{background-color:var(--red-400)}
.bg-red-500{background-color:var(--red-500)} .bg-red-600{background-color:var(--red-600)}
.border-red-100{border-color:var(--red-100)} .border-red-200{border-color:var(--red-200)}
.border-red-400{border-color:var(--red-400)} .border-red-500{border-color:var(--red-500)}

.text-green-500{color:var(--green-500)} .text-green-600{color:var(--green-600)} .text-green-700{color:var(--green-700)}
.bg-green-50{background-color:var(--green-50)} .bg-green-100{background-color:var(--green-100)}
.bg-green-200{background-color:var(--green-200)} .bg-green-500{background-color:var(--green-500)}
.bg-green-600{background-color:var(--green-600)}
.border-green-100{border-color:var(--green-100)} .border-green-200{border-color:var(--green-200)}
.border-green-500{border-color:var(--green-500)}

.text-emerald-400{color:var(--emerald-400)} .text-emerald-500{color:var(--emerald-500)}
.text-emerald-600{color:var(--emerald-600)} .text-emerald-700{color:var(--emerald-700)}
.text-emerald-800{color:var(--emerald-800)}
.bg-emerald-50{background-color:var(--emerald-50)} .bg-emerald-100{background-color:var(--emerald-100)}
.bg-emerald-300{background-color:var(--emerald-300)} .bg-emerald-400{background-color:var(--emerald-400)}
.bg-emerald-500{background-color:var(--emerald-500)} .bg-emerald-600{background-color:var(--emerald-600)}
.border-emerald-100{border-color:var(--emerald-100)} .border-emerald-200{border-color:var(--emerald-100)}

.text-amber-400{color:var(--amber-400)} .text-amber-500{color:var(--amber-500)}
.text-amber-600{color:var(--amber-600)} .text-amber-700{color:var(--amber-700)}
.text-amber-800{color:var(--amber-800)} .text-amber-900{color:var(--amber-900)}
.bg-amber-50{background-color:var(--amber-50)} .bg-amber-100{background-color:var(--amber-100)}
.bg-amber-200{background-color:var(--amber-200)} .bg-amber-400{background-color:var(--amber-400)}
.bg-amber-500{background-color:var(--amber-500)} .bg-amber-600{background-color:var(--amber-600)}
.border-amber-100{border-color:var(--amber-100)} .border-amber-200{border-color:var(--amber-200)}
.border-amber-500{border-color:var(--amber-500)}
.text-yellow-500{color:var(--yellow-500)} .bg-yellow-500{background-color:var(--yellow-500)}
.bg-orange-300{background-color:var(--orange-300)} .text-orange-500{color:var(--orange-500)}

.text-blue-400{color:var(--blue-400)} .text-blue-500{color:var(--blue-500)}
.text-blue-600{color:var(--blue-600)} .text-blue-700{color:var(--blue-700)}
.text-blue-800{color:var(--blue-800)} .text-blue-900{color:var(--blue-900)}
.bg-blue-50{background-color:var(--blue-50)} .bg-blue-100{background-color:var(--blue-100)}
.bg-blue-200{background-color:var(--blue-200)} .bg-blue-400{background-color:var(--blue-400)}
.bg-blue-500{background-color:var(--blue-500)} .bg-blue-600{background-color:var(--blue-600)}
.border-blue-100{border-color:var(--blue-100)} .border-blue-200{border-color:var(--blue-200)}
.border-blue-500{border-color:var(--blue-500)}
.bg-sky-50{background-color:var(--sky-50)} .bg-sky-100{background-color:var(--sky-100)}
.text-sky-500{color:var(--sky-500)} .bg-teal-100{background-color:var(--teal-100)}

.text-indigo-400{color:var(--indigo-400)} .text-indigo-500{color:var(--indigo-500)}
.text-indigo-600{color:var(--indigo-600)} .text-indigo-700{color:var(--indigo-700)}
.bg-indigo-50{background-color:var(--indigo-50)} .bg-indigo-100{background-color:var(--indigo-100)}
.bg-indigo-500{background-color:var(--indigo-500)} .bg-indigo-600{background-color:var(--indigo-600)}

/* Fundos translúcidos usados nos cartões e sobreposições */
.bg-white\/5{background-color:rgba(255,255,255,.05)} .bg-white\/10{background-color:rgba(255,255,255,.1)}
.bg-white\/20{background-color:rgba(255,255,255,.2)} .bg-white\/60{background-color:rgba(255,255,255,.6)}
.bg-white\/80{background-color:rgba(255,255,255,.8)} .bg-white\/90{background-color:rgba(255,255,255,.9)}
.bg-black\/20{background-color:rgba(0,0,0,.2)} .bg-black\/30{background-color:rgba(0,0,0,.3)}
.bg-black\/40{background-color:rgba(0,0,0,.4)} .bg-black\/50{background-color:rgba(0,0,0,.5)}
.bg-black\/60{background-color:rgba(0,0,0,.6)} .bg-black\/70{background-color:rgba(0,0,0,.7)}
.bg-brand-purple\/5{background-color:rgba(219,25,255,.05)}
.bg-brand-purple\/10{background-color:rgba(219,25,255,.1)}
.bg-brand-purple\/20{background-color:rgba(219,25,255,.2)}
.bg-brand-purple\/90{background-color:rgba(219,25,255,.9)}
.bg-purple-50\/20{background-color:rgba(253,244,255,.2)}
.bg-purple-50\/50{background-color:rgba(253,244,255,.5)}
.bg-purple-50\/60{background-color:rgba(253,244,255,.6)}
.bg-amber-50\/20{background-color:rgba(255,251,235,.2)}
.bg-slate-200\/40{background-color:rgba(226,232,240,.4)}
.bg-slate-200\/50{background-color:rgba(226,232,240,.5)}
.border-brand-purple\/10{border-color:rgba(219,25,255,.1)}
.border-brand-purple\/30{border-color:rgba(219,25,255,.3)}
.border-purple-100\/80{border-color:rgba(250,232,255,.8)}
.text-brand-purple\/70{color:rgba(219,25,255,.7)}

/* Gradientes */
.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-from),var(--tw-to))}
.bg-gradient-to-l{background-image:linear-gradient(to left,var(--tw-from),var(--tw-to))}
.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-from),var(--tw-to))}
.bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-from),var(--tw-to))}
.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-from),var(--tw-to))}
.bg-gradient-to-tr{background-image:linear-gradient(to top right,var(--tw-from),var(--tw-to))}
.from-white{--tw-from:#fff} .to-white{--tw-to:#fff}
.from-transparent{--tw-from:transparent} .to-transparent{--tw-to:transparent}
.from-black{--tw-from:#000} .to-black{--tw-to:#000}
.from-brand-purple{--tw-from:var(--brand-purple)} .to-brand-purple{--tw-to:var(--brand-purple)}
.from-purple-50{--tw-from:var(--purple-50)} .from-purple-100{--tw-from:var(--purple-100)}
.to-purple-100{--tw-to:var(--purple-100)} .from-purple-500{--tw-from:var(--purple-500)}
.to-purple-600{--tw-to:var(--purple-600)} .to-indigo-100{--tw-to:var(--indigo-100)}
.from-slate-50{--tw-from:var(--slate-50)} .from-slate-100{--tw-from:var(--slate-100)}
.to-slate-100{--tw-to:var(--slate-100)} .to-gray-200{--tw-to:var(--gray-200)}
.from-slate-900{--tw-from:var(--slate-900)} .to-slate-900{--tw-to:var(--slate-900)}
.from-gray-900{--tw-from:var(--gray-900)} .to-gray-800{--tw-to:var(--gray-800)}
.from-blue-100{--tw-from:var(--blue-100)} .to-sky-100{--tw-to:var(--sky-100)}
.from-emerald-100{--tw-from:var(--emerald-100)} .to-teal-100{--tw-to:var(--teal-100)}
.from-rose-100{--tw-from:#ffe4e6} .to-red-100{--tw-to:var(--red-100)}
.from-pink-100{--tw-from:#fce7f3} .to-fuchsia-100{--tw-to:#fae8ff}
.from-amber-100{--tw-from:var(--amber-100)} .to-amber-100{--tw-to:var(--amber-100)}
.from-indigo-100{--tw-from:var(--indigo-100)}
.from-brand-purple\/20{--tw-from:rgba(219,25,255,.2)} .to-orange-300\/20{--tw-to:rgba(253,186,116,.2)}
.from-brand-purple\/5{--tw-from:rgba(219,25,255,.05)}
.from-brand-purple\/\[0\.07\]{--tw-from:rgba(219,25,255,.07)}
.from-brand-purple\/\[0\.08\]{--tw-from:rgba(219,25,255,.08)}
.from-brand-purple\/\[0\.12\]{--tw-from:rgba(219,25,255,.12)}
.bg-brand-purple\/\[0\.05\]{background-color:rgba(219,25,255,.05)}
.bg-brand-purple\/\[0\.07\]{background-color:rgba(219,25,255,.07)}
.bg-brand-purple\/\[0\.08\]{background-color:rgba(219,25,255,.08)}
.bg-brand-purple\/\[0\.12\]{background-color:rgba(219,25,255,.12)}

/* ---------- Bordas e raios ---------------------------------------------- */
.border{border-width:1px} .border-0{border-width:0} .border-2{border-width:2px}
.border-4{border-width:4px} .border-8{border-width:8px}
.border-t{border-top-width:1px} .border-r{border-right-width:1px}
.border-b{border-bottom-width:1px} .border-l{border-left-width:1px}
.border-t-2{border-top-width:2px} .border-b-2{border-bottom-width:2px} .border-l-4{border-left-width:4px}
.border-solid{border-style:solid} .border-dashed{border-style:dashed} .border-none{border-style:none}

.rounded-none{border-radius:0} .rounded-sm{border-radius:.125rem} .rounded{border-radius:.25rem}
.rounded-md{border-radius:.375rem} .rounded-lg{border-radius:.5rem} .rounded-xl{border-radius:.75rem}
.rounded-2xl{border-radius:1rem} .rounded-3xl{border-radius:1.5rem} .rounded-full{border-radius:9999px}
.rounded-\[2rem\]{border-radius:2rem} .rounded-\[2\.5rem\]{border-radius:2.5rem}
.rounded-\[3rem\]{border-radius:3rem} .rounded-\[4rem\]{border-radius:4rem}
.rounded-t-2xl{border-top-left-radius:1rem;border-top-right-radius:1rem}
.rounded-b-2xl{border-bottom-left-radius:1rem;border-bottom-right-radius:1rem}
.rounded-bl-xl{border-bottom-left-radius:.75rem}
.rounded-tr-xl{border-top-right-radius:.75rem}

.ring-1{box-shadow:0 0 0 1px var(--ring-c,rgba(59,130,246,.5))}
.ring-2{box-shadow:0 0 0 2px var(--ring-c,rgba(59,130,246,.5))}
.ring-4{box-shadow:0 0 0 4px var(--ring-c,rgba(59,130,246,.5))}
.ring-8{box-shadow:0 0 0 8px var(--ring-c,rgba(59,130,246,.5))}
.ring-white{--ring-c:#fff} .ring-brand-purple{--ring-c:var(--brand-purple)}
.ring-purple-500{--ring-c:var(--purple-500)} .ring-green-500{--ring-c:var(--green-500)}
.ring-red-500{--ring-c:var(--red-500)} .ring-gray-200{--ring-c:var(--gray-200)}
.ring-brand-purple\/10{--ring-c:rgba(219,25,255,.1)}
.ring-purple-500\/10{--ring-c:rgba(217,70,239,.1)}

/* ---------- Sombras ----------------------------------------------------- */
.shadow-none{box-shadow:none} .shadow-sm{box-shadow:var(--shadow-sm)} .shadow{box-shadow:var(--shadow)}
.shadow-md{box-shadow:var(--shadow-md)} .shadow-lg{box-shadow:var(--shadow-lg)}
.shadow-xl{box-shadow:var(--shadow-xl)} .shadow-2xl{box-shadow:var(--shadow-2xl)}
.shadow-inner{box-shadow:inset 0 2px 4px 0 rgba(0,0,0,.05)}
/* Sombras coloridas: a cor entra no alpha do próprio box-shadow */
.shadow-purple-200,.shadow-purple-500\/20,.shadow-purple-500\/25,.shadow-purple-500\/30,
.shadow-brand-purple\/20,.shadow-brand-purple\/30{box-shadow:0 10px 15px -3px rgba(219,25,255,.25),0 4px 6px -4px rgba(219,25,255,.15)}
.shadow-slate-200\/40,.shadow-slate-200\/50,.shadow-gray-200\/50{box-shadow:0 10px 15px -3px rgba(148,163,184,.2),0 4px 6px -4px rgba(148,163,184,.15)}
.shadow-gray-900\/20{box-shadow:0 10px 15px -3px rgba(17,24,39,.2)}
.shadow-slate-800\/20{box-shadow:0 20px 25px -5px rgba(30,41,59,.2)}
.shadow-red-500\/20{box-shadow:0 10px 15px -3px rgba(239,68,68,.2)}
.shadow-green-500\/20{box-shadow:0 10px 15px -3px rgba(34,197,94,.2)}

/* ---------- Opacidade, filtros, transformações -------------------------- */
.opacity-0{opacity:0} .opacity-5{opacity:.05} .opacity-10{opacity:.1} .opacity-20{opacity:.2}
.opacity-30{opacity:.3} .opacity-40{opacity:.4} .opacity-50{opacity:.5} .opacity-60{opacity:.6}
.opacity-70{opacity:.7} .opacity-80{opacity:.8} .opacity-90{opacity:.9} .opacity-95{opacity:.95}
.opacity-100{opacity:1}

.blur-sm{filter:blur(4px)} .blur{filter:blur(8px)} .blur-md{filter:blur(12px)}
.blur-lg{filter:blur(16px)} .blur-xl{filter:blur(24px)} .blur-2xl{filter:blur(40px)}
.blur-3xl{filter:blur(64px)}
.blur-\[80px\]{filter:blur(80px)} .blur-\[100px\]{filter:blur(100px)}
.backdrop-blur-sm{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.backdrop-blur{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.backdrop-blur-md{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.backdrop-blur-lg{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.backdrop-blur-xl{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}
.grayscale{filter:grayscale(100%)}

.transform{transform:translate(var(--tx,0),var(--ty,0)) rotate(var(--rot,0)) scale(var(--sx,1),var(--sy,1))}
.scale-0{transform:scale(0)} .scale-50{transform:scale(.5)} .scale-95{transform:scale(.95)}
.scale-100{transform:scale(1)} .scale-105{transform:scale(1.05)} .scale-110{transform:scale(1.1)}
.scale-125{transform:scale(1.25)}
.rotate-0{transform:rotate(0)} .rotate-45{transform:rotate(45deg)} .rotate-90{transform:rotate(90deg)}
.rotate-180{transform:rotate(180deg)} .-rotate-2{transform:rotate(-2deg)} .-rotate-90{transform:rotate(-90deg)}
.translate-x-0{transform:translateX(0)} .translate-x-1{transform:translateX(.25rem)}
.translate-x-9{transform:translateX(2.25rem)} .translate-x-full{transform:translateX(100%)}
.-translate-x-full{transform:translateX(-100%)} .-translate-y-1{transform:translateY(-.25rem)}
.-translate-y-1\/2{transform:translateY(-50%)} .-translate-x-1\/2{transform:translateX(-50%)}
.translate-y-0{transform:translateY(0)}
.origin-center{transform-origin:center} .origin-top{transform-origin:top}

/* ---------- Transições e animações -------------------------------------- */
.transition{transition:color .15s var(--ease),background-color .15s var(--ease),border-color .15s var(--ease),
    box-shadow .15s var(--ease),opacity .15s var(--ease),transform .15s var(--ease),filter .15s var(--ease)}
.transition-all{transition:all .15s var(--ease)}
.transition-colors{transition:color .15s var(--ease),background-color .15s var(--ease),border-color .15s var(--ease)}
.transition-opacity{transition:opacity .15s var(--ease)}
.transition-transform{transition:transform .15s var(--ease)}
.transition-shadow{transition:box-shadow .15s var(--ease)}
.duration-100{transition-duration:.1s} .duration-150{transition-duration:.15s}
.duration-200{transition-duration:.2s} .duration-300{transition-duration:.3s}
.duration-500{transition-duration:.5s} .duration-700{transition-duration:.7s}
.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}
.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}
.ease-in-out{transition-timing-function:var(--ease)}
.delay-100{transition-delay:.1s} .delay-200{transition-delay:.2s}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes ping{75%,100%{transform:scale(2);opacity:0}}
@keyframes pulse{50%{opacity:.5}}
@keyframes bounce{0%,100%{transform:translateY(-25%);animation-timing-function:cubic-bezier(.8,0,1,1)}
    50%{transform:none;animation-timing-function:cubic-bezier(0,0,.2,1)}}
@keyframes fade-in{from{opacity:0}to{opacity:1}}
@keyframes fade-in-up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.animate-spin{animation:spin 1s linear infinite}
.animate-ping{animation:ping 1s cubic-bezier(0,0,.2,1) infinite}
.animate-pulse{animation:pulse 2s var(--ease) infinite}
.animate-bounce{animation:bounce 1s infinite}
.animate-fade-in{animation:fade-in .5s var(--ease) both}
.animate-fade-in-up{animation:fade-in-up .5s cubic-bezier(.16,1,.3,1) both}

/* ---------- Variantes de estado ----------------------------------------- */
.hover\:bg-white:hover{background-color:#fff}
.hover\:bg-black:hover{background-color:#000}
.hover\:bg-gray-50:hover{background-color:var(--gray-50)}
.hover\:bg-gray-100:hover{background-color:var(--gray-100)}
.hover\:bg-gray-200:hover{background-color:var(--gray-200)}
.hover\:bg-slate-50:hover{background-color:var(--slate-50)}
.hover\:bg-slate-100:hover{background-color:var(--slate-100)}
.hover\:bg-purple-50:hover{background-color:var(--purple-50)}
.hover\:bg-purple-100:hover{background-color:var(--purple-100)}
.hover\:bg-purple-700:hover{background-color:var(--purple-700)}
.hover\:bg-brand-purple:hover{background-color:var(--brand-purple)}
.hover\:bg-brand-purple\/90:hover{background-color:rgba(219,25,255,.9)}
.hover\:bg-red-50:hover{background-color:var(--red-50)}
.hover\:bg-red-100:hover{background-color:var(--red-100)}
.hover\:bg-red-600:hover{background-color:var(--red-600)}
.hover\:bg-green-100:hover{background-color:var(--green-100)}
.hover\:bg-amber-50:hover{background-color:var(--amber-50)}
.hover\:bg-amber-100:hover{background-color:var(--amber-100)}
.hover\:bg-amber-600:hover{background-color:var(--amber-600)}
.hover\:bg-blue-600:hover{background-color:var(--blue-600)}
.hover\:bg-slate-800:hover{background-color:var(--slate-800)}
.hover\:bg-gray-900:hover{background-color:var(--gray-900)}
.hover\:bg-purple-50\/50:hover{background-color:rgba(253,244,255,.5)}
.hover\:bg-brand-purple\/10:hover{background-color:rgba(219,25,255,.1)}

.hover\:text-white:hover{color:#fff}
.hover\:text-brand-purple:hover{color:var(--brand-purple)}
.hover\:text-purple-700:hover{color:var(--purple-700)}
.hover\:text-gray-600:hover{color:var(--gray-600)}
.hover\:text-gray-700:hover{color:var(--gray-700)}
.hover\:text-gray-900:hover{color:var(--gray-900)}
.hover\:text-slate-600:hover{color:var(--slate-600)}
.hover\:text-slate-900:hover{color:var(--slate-900)}
.hover\:text-red-500:hover{color:var(--red-500)}
.hover\:text-red-600:hover{color:var(--red-600)}
.hover\:text-green-700:hover{color:var(--green-700)}

.hover\:border-brand-purple:hover{border-color:var(--brand-purple)}
.hover\:border-purple-200:hover{border-color:var(--purple-200)}
.hover\:border-purple-300:hover{border-color:var(--purple-300)}
.hover\:border-red-200:hover{border-color:var(--red-200)}
.hover\:border-gray-300:hover{border-color:var(--gray-300)}
.hover\:border-slate-200:hover{border-color:var(--slate-200)}
.hover\:border-brand-purple\/30:hover{border-color:rgba(219,25,255,.3)}

.hover\:shadow:hover{box-shadow:var(--shadow)}
.hover\:shadow-md:hover{box-shadow:var(--shadow-md)}
.hover\:shadow-lg:hover{box-shadow:var(--shadow-lg)}
.hover\:shadow-xl:hover{box-shadow:var(--shadow-xl)}
.hover\:shadow-2xl:hover{box-shadow:var(--shadow-2xl)}
.hover\:scale-105:hover{transform:scale(1.05)}
.hover\:scale-110:hover{transform:scale(1.1)}
.hover\:-translate-y-1:hover{transform:translateY(-.25rem)}
.hover\:-translate-y-2:hover{transform:translateY(-.5rem)}
.hover\:opacity-90:hover{opacity:.9}
.hover\:opacity-100:hover{opacity:1}
.hover\:underline:hover{text-decoration-line:underline}
.hover\:gap-4:hover{gap:1rem}

.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}
.focus\:border-brand-purple:focus{border-color:var(--brand-purple)}
.focus\:border-purple-500:focus{border-color:var(--purple-500)}
.focus\:border-transparent:focus{border-color:transparent}
.focus\:bg-white:focus{background-color:#fff}
.focus\:ring-2:focus{box-shadow:0 0 0 2px var(--ring-c,rgba(219,25,255,.5))}
.focus\:ring-4:focus{box-shadow:0 0 0 4px var(--ring-c,rgba(219,25,255,.2))}
.focus\:ring-brand-purple:focus{--ring-c:var(--brand-purple)}
.focus\:ring-purple-500:focus{--ring-c:var(--purple-500)}
.focus\:ring-purple-500\/10:focus{--ring-c:rgba(217,70,239,.1)}
.focus-visible\:outline-none:focus-visible{outline:2px solid transparent}

.active\:scale-95:active{transform:scale(.95)}
.active\:scale-\[0\.98\]:active{transform:scale(.98)}

.disabled\:opacity-50:disabled{opacity:.5}
.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}

.group:hover .group-hover\:scale-105{transform:scale(1.05)}
.group:hover .group-hover\:scale-110{transform:scale(1.1)}
.group:hover .group-hover\:-rotate-2{transform:rotate(-2deg)}
.group:hover .group-hover\:opacity-100{opacity:1}
.group:hover .group-hover\:text-brand-purple{color:var(--brand-purple)}
.group:hover .group-hover\:text-white{color:#fff}
.group:hover .group-hover\:bg-brand-purple{background-color:var(--brand-purple)}
.group:hover .group-hover\:bg-brand-purple\/10{background-color:rgba(219,25,255,.1)}
.group:hover .group-hover\:translate-x-1{transform:translateX(.25rem)}
.group:hover .group-hover\:gap-4{gap:1rem}

/* ---------- Pontos de quebra -------------------------------------------- */
@media (min-width:640px){
    .sm\:block{display:block} .sm\:inline{display:inline} .sm\:flex{display:flex} .sm\:hidden{display:none}
    .sm\:flex-row{flex-direction:row} .sm\:items-center{align-items:center}
    .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
    .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
    .sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}
    .sm\:text-left{text-align:left} .sm\:w-auto{width:auto}
}
@media (min-width:768px){
    .md\:block{display:block} .md\:inline{display:inline} .md\:flex{display:flex}
    .md\:inline-flex{display:inline-flex} .md\:grid{display:grid} .md\:hidden{display:none}
    .md\:flex-row{flex-direction:row} .md\:flex-col{flex-direction:column}
    .md\:items-center{align-items:center} .md\:justify-between{justify-content:space-between}
    .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
    .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
    .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
    .md\:col-span-2{grid-column:span 2/span 2}
    .md\:p-8{padding:2rem} .md\:p-16{padding:4rem}
    .md\:px-6{padding-left:1.5rem;padding-right:1.5rem}
    .md\:text-left{text-align:left} .md\:text-center{text-align:center}
    .md\:text-xl{font-size:1.25rem;line-height:1.75rem}
    .md\:text-2xl{font-size:1.5rem;line-height:2rem}
    .md\:text-3xl{font-size:1.875rem;line-height:2.25rem}
    .md\:text-4xl{font-size:2.25rem;line-height:2.5rem}
    .md\:text-5xl{font-size:3rem;line-height:1.1}
    .md\:w-56{width:14rem} .md\:h-13{height:3.25rem} .md\:h-56{height:14rem}
    .md\:justify-start{justify-content:flex-start} .md\:mt-0{margin-top:0}
}
@media (min-width:1024px){
    .lg\:block{display:block} .lg\:flex{display:flex} .lg\:grid{display:grid} .lg\:hidden{display:none}
    .lg\:flex-row{flex-direction:row}
    .lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
    .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
    .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
    .lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
    .lg\:px-8{padding-left:2rem;padding-right:2rem}
    .lg\:w-1\/2{width:50%} .lg\:w-1\/3{width:33.333333%}
    .lg\:text-lg{font-size:1.125rem;line-height:1.75rem}
    .lg\:text-xl{font-size:1.25rem;line-height:1.75rem}
    .lg\:text-6xl{font-size:3.75rem;line-height:1.05}
    .lg\:col-span-2{grid-column:span 2/span 2}
}
@media (min-width:1280px){
    .xl\:block{display:block} .xl\:flex{display:flex} .xl\:hidden{display:none}
    .xl\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* ---------- Impressão --------------------------------------------------- */
@media print {
    .no-print{display:none !important}
    .print-only{display:block !important}
}
.print-only{display:none}

/* ---------- Conteúdo rico (artigos do blog e páginas do guia) ----------- */
.prose{color:var(--slate-600);line-height:1.75;max-width:65ch}
.prose :where(h2){font-size:1.5rem;font-weight:800;color:var(--slate-900);margin:2rem 0 .75rem;line-height:1.3}
.prose :where(h3){font-size:1.25rem;font-weight:700;color:var(--slate-900);margin:1.5rem 0 .5rem}
.prose :where(p){margin:1rem 0}
.prose :where(ul){list-style:disc;padding-left:1.5rem;margin:1rem 0}
.prose :where(ol){list-style:decimal;padding-left:1.5rem;margin:1rem 0}
.prose :where(li){margin:.375rem 0}
.prose :where(a){color:var(--brand-purple);text-decoration:underline}
.prose :where(strong){color:var(--slate-900);font-weight:700}
.prose :where(img){border-radius:1rem;margin:1.5rem 0}
.prose :where(blockquote){border-left:4px solid var(--purple-200);padding-left:1rem;font-style:italic;margin:1.5rem 0}
.prose :where(code){background:var(--slate-100);padding:.125rem .375rem;border-radius:.25rem;font-size:.875em}
.prose-lg{font-size:1.0625rem}
.prose-slate{color:var(--slate-600)}
.max-w-none{max-width:none}