/* =========================================================
   SERVENTIAX — GLOBAL DESIGN TOKENS V2
   Fonte visual: brand board institucional aprovado em 20/08/2026.
   Escopo: GLOBAL · todos os produtos, páginas, módulos e estados.
   ========================================================= */

@import url('/serventiax-responsive-v2.css');
@import url('/serventiax-quality-v2.css');

:root{
  color-scheme:light;

  /* Marca */
  --sx-midnight:#0D1B2A;
  --sx-midnight-deep:#061421;
  --sx-midnight-soft:#153650;
  --sx-gold:#C99A5D;
  --sx-gold-light:#EDCC95;
  --sx-gold-dark:#92602D;
  --sx-graphite:#1F2328;
  --sx-ivory:#F7F6F2;
  --sx-ivory-deep:#EFEAE2;
  --sx-white:#FFFFFF;
  --sx-teal:#0EA5A8;

  /* Superfícies e texto */
  --sx-surface-page:var(--sx-ivory);
  --sx-surface-page-deep:var(--sx-ivory-deep);
  --sx-surface-card:#FFFFFF;
  --sx-surface-soft:#FBFAF7;
  --sx-surface-dark:var(--sx-midnight);
  --sx-text:var(--sx-graphite);
  --sx-text-strong:var(--sx-midnight);
  --sx-text-muted:#69737D;
  --sx-text-soft:#89939B;
  --sx-text-on-dark:#F8F6F1;
  --sx-text-on-dark-muted:#C8D1D7;
  --sx-line:#E3DED6;
  --sx-line-strong:#D6D0C7;

  /* Estados semânticos — nunca substituem as cores de marca */
  --sx-success:#0B7F82;
  --sx-success-soft:#E6F6F6;
  --sx-warning:#8A622F;
  --sx-warning-soft:#FFF7E9;
  --sx-danger:#9B3C3C;
  --sx-danger-soft:#FFF1F0;
  --sx-info:#335F7D;
  --sx-info-soft:#EEF5F8;

  /* Tipografia */
  --sx-font:'Manrope Variable','Manrope',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --sx-weight-light:350;
  --sx-weight-regular:430;
  --sx-weight-medium:560;
  --sx-weight-semibold:650;
  --sx-weight-bold:740;
  --sx-display-size:clamp(2.75rem,5vw,4.5rem);
  --sx-page-title-size:clamp(1.75rem,2.4vw,2.25rem);
  --sx-section-title-size:clamp(1.15rem,1.5vw,1.4rem);
  --sx-body-size:.875rem;
  --sx-small-size:.75rem;
  --sx-label-size:.6875rem;
  --sx-display-tracking:-.055em;
  --sx-title-tracking:-.035em;
  --sx-label-tracking:.14em;
  --sx-body-leading:1.62;

  /* Espaçamento — escala única */
  --sx-space-1:4px;
  --sx-space-2:8px;
  --sx-space-3:12px;
  --sx-space-4:16px;
  --sx-space-5:20px;
  --sx-space-6:24px;
  --sx-space-7:28px;
  --sx-space-8:32px;
  --sx-space-10:40px;
  --sx-space-12:48px;
  --sx-space-16:64px;
  --sx-space-20:80px;

  /* Geometria */
  --sx-radius-xs:7px;
  --sx-radius-sm:9px;
  --sx-radius-md:12px;
  --sx-radius-lg:16px;
  --sx-radius-xl:20px;
  --sx-radius-2xl:24px;
  --sx-radius-round:999px;
  --sx-control-height:44px;
  --sx-sidebar-width:238px;
  --sx-content-max:1480px;

  /* Elevação */
  --sx-shadow-xs:0 4px 14px rgba(13,27,42,.035);
  --sx-shadow-sm:0 8px 24px rgba(13,27,42,.055);
  --sx-shadow-md:0 18px 48px rgba(13,27,42,.085);
  --sx-shadow-lg:0 30px 80px rgba(6,20,33,.15);
  --sx-shadow-panel:0 24px 70px rgba(13,27,42,.095);

  /* Profundidade institucional */
  --sx-gold-gradient:linear-gradient(135deg,#F3D89F 0%,#DFB575 30%,#C99A5D 57%,#94612E 100%);
  --sx-navy-gradient:linear-gradient(145deg,#061421 0%,#0D1B2A 55%,#12334B 100%);
  --sx-ivory-gradient:linear-gradient(180deg,#FBFAF7 0%,#F7F6F2 100%);
  --sx-focus-ring:0 0 0 3px rgba(201,154,93,.16);

  /* Movimento */
  --sx-ease:cubic-bezier(.2,.75,.25,1);
  --sx-duration-fast:140ms;
  --sx-duration:180ms;
  --sx-duration-slow:260ms;
}

html,body,button,input,select,textarea{font-family:var(--sx-font)}
html body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:rgba(201,154,93,.27);color:var(--sx-midnight)}

:where(button,a,input,select,textarea):focus-visible{
  outline:2px solid rgba(201,154,93,.82);
  outline-offset:2px;
}

.sx-institutional-surface{
  color:var(--sx-text-on-dark);
  background:
    radial-gradient(circle at 14% 15%,rgba(201,154,93,.12),transparent 24%),
    radial-gradient(circle at 86% 82%,rgba(14,165,168,.055),transparent 26%),
    var(--sx-navy-gradient);
}
.sx-card-surface{
  background:var(--sx-surface-card);
  border:1px solid var(--sx-line);
  border-radius:var(--sx-radius-lg);
  box-shadow:var(--sx-shadow-sm);
}
.sx-eyebrow{
  color:var(--sx-gold-dark);
  font-size:var(--sx-label-size);
  font-weight:var(--sx-weight-bold);
  letter-spacing:var(--sx-label-tracking);
  text-transform:uppercase;
}

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