/*!
 * GPSRS Brand — fonte única de identidade visual
 * Servido em: https://www.gpsrs.com.br/brand/gpsrs-brand.css
 *
 * Usado por: gpsrs.com.br (referência) e painel.gpsrs.com.br (WHMCS, tema gpsrsnew).
 * Qualquer mudança de cor/fonte feita aqui reflete nos dois.
 * Os valores espelham exatamente app/page.tsx do site.
 */

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@24,400,1,0');

:root {
  /* ── Cores principais ─────────────────────────── */
  --gp-primary:        #1E5BD6;   /* azul GPSRS — links, ícones, botões secundários */
  --gp-primary-hover:  #174BB8;
  --gp-primary-deep:   #0E3A9E;   /* fim dos gradientes azuis */
  --gp-primary-soft:   #EAF1FB;   /* fundo de botão secundário / chips */
  --gp-primary-live:   #2F6BFF;   /* ponto "ao vivo" */

  --gp-accent:         #FF6A1F;   /* laranja — CTA principal (cotação, pagar) */
  --gp-accent-hover:   #E8480A;
  --gp-accent-soft:    rgba(255,106,31,.16);

  --gp-navy:           #0E1E3A;   /* texto principal, blocos escuros */
  --gp-navy-2:         #13294B;
  --gp-footer:         #0A1430;   /* fundo do rodapé */

  --gp-bg:             #EEF3FA;   /* fundo das páginas */
  --gp-surface:        #FFFFFF;   /* cards */

  --gp-text:           #0E1E3A;
  --gp-text-2:         #3A4A66;
  --gp-muted:          #5A6B86;
  --gp-subtle:         #8A99B0;
  --gp-on-dark:        #9DB6E8;   /* texto secundário em fundo escuro */
  --gp-on-dark-2:      #CFE0FF;
  --gp-on-dark-3:      #7C92BC;

  --gp-success:        #16A34A;
  --gp-success-soft:   #E7F8EE;
  --gp-success-live:   #7CFFA8;
  --gp-danger:         #DC2626;
  --gp-danger-soft:    #FDECEC;
  --gp-warning:        #D97706;
  --gp-warning-soft:   #FFF4E0;
  --gp-whatsapp:       #25D366;

  --gp-border:         rgba(14,30,58,.08);
  --gp-border-strong:  rgba(14,30,58,.14);

  /* ── Gradientes ───────────────────────────────── */
  --gp-grad-primary:   linear-gradient(160deg, #1E5BD6, #0E3A9E);
  --gp-grad-dark:      linear-gradient(155deg, #0E3A9E, #13294B);
  --gp-grad-accent:    linear-gradient(150deg, #FF6A1F, #E8480A);

  /* ── Tipografia ───────────────────────────────── */
  --gp-font-display:   'Sora', 'Plus Jakarta Sans', system-ui, sans-serif;
  --gp-font-body:      'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --gp-font-icon:      'Material Symbols Rounded';

  /* ── Forma ────────────────────────────────────── */
  --gp-radius-sm:      10px;   /* botões pequenos, inputs do header */
  --gp-radius:         12px;   /* botões, inputs */
  --gp-radius-md:      16px;   /* cards pequenos */
  --gp-radius-lg:      18px;   /* cards */
  --gp-radius-xl:      24px;   /* blocos de destaque */
  --gp-radius-pill:    100px;

  --gp-shadow-card:    0 18px 36px -16px rgba(14,30,58,.18);
  --gp-shadow-float:   0 18px 36px -16px rgba(14,30,58,.35);
  --gp-shadow-accent:  0 16px 30px -14px rgba(255,106,31,.7);
  --gp-shadow-primary: 0 28px 56px -28px rgba(30,91,214,.6);

  --gp-wrap:           1180px;
}

/* ── Componentes reutilizáveis (prefixo gp-) ─────────────────────────── */

.gp-ms {
  font-family: var(--gp-font-icon);
  font-weight: normal; font-style: normal; line-height: 1;
  display: inline-block; font-size: 20px;
  -webkit-font-feature-settings: 'liga'; font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

.gp-wrap { max-width: var(--gp-wrap); margin: 0 auto; padding-left: 22px; padding-right: 22px; }
@media (max-width: 560px) { .gp-wrap { padding-left: 15px; padding-right: 15px; } }

.gp-display { font-family: var(--gp-font-display); font-weight: 800; letter-spacing: -.025em; }
.gp-eyebrow { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--gp-primary); }

.gp-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--gp-font-body); font-weight: 700; font-size: 15px; line-height: 1.2;
  padding: 13px 20px; border-radius: var(--gp-radius); border: 1px solid transparent;
  text-decoration: none; cursor: pointer; transition: background .2s, transform .2s, box-shadow .2s;
}
.gp-btn:hover { transform: translateY(-1px); text-decoration: none; }
.gp-btn--accent  { background: var(--gp-accent); color: #fff; box-shadow: var(--gp-shadow-accent); }
.gp-btn--accent:hover { background: var(--gp-accent-hover); color: #fff; }
.gp-btn--primary { background: var(--gp-primary); color: #fff; }
.gp-btn--primary:hover { background: var(--gp-primary-hover); color: #fff; }
.gp-btn--soft    { background: var(--gp-primary-soft); color: var(--gp-primary); }
.gp-btn--soft:hover { background: #DCE6F6; color: var(--gp-primary); }
.gp-btn--ghost   { background: #fff; color: var(--gp-navy); border-color: rgba(14,30,58,.12); }
.gp-btn--whatsapp{ background: var(--gp-whatsapp); color: #fff; }
.gp-btn--sm      { font-size: 13.5px; padding: 10px 16px; border-radius: var(--gp-radius-sm); }

.gp-card {
  background: var(--gp-surface); border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-lg); padding: 22px;
}
.gp-card--brand { background: var(--gp-grad-primary); color: #fff; border: none; }

.gp-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 700; padding: 5px 11px; border-radius: var(--gp-radius-pill);
  background: var(--gp-primary-soft); color: var(--gp-primary);
}
.gp-badge--success { background: var(--gp-success-soft); color: var(--gp-success); }
.gp-badge--danger  { background: var(--gp-danger-soft);  color: var(--gp-danger); }
.gp-badge--warning { background: var(--gp-warning-soft); color: var(--gp-warning); }
.gp-badge--accent  { background: var(--gp-accent); color: #fff; letter-spacing: .06em; }

/* ── Header padrão (mesmo do site) ───────────────────────────────────── */
.gp-header {
  position: sticky; top: 0; z-index: 1030;
  background: rgba(238,243,250,.85);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--gp-border);
  font-family: var(--gp-font-body);
}
.gp-header__bar { display: flex; align-items: center; gap: 20px; padding-top: 13px; padding-bottom: 13px; }
.gp-header__logo img { height: 28px; width: auto; display: block; }
.gp-header__nav { display: flex; gap: 22px; margin-left: 12px; font-size: 14px; font-weight: 600; }
.gp-header__nav a { color: var(--gp-muted); text-decoration: none; }
.gp-header__nav a:hover, .gp-header__nav a.is-active { color: var(--gp-navy); }
.gp-header__actions { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.gp-header__burger {
  display: none; align-items: center; justify-content: center; width: 40px; height: 40px;
  border: 1px solid rgba(14,30,58,.12); background: #fff; border-radius: var(--gp-radius-sm); cursor: pointer;
}
.gp-header__mobile { display: none; border-top: 1px solid var(--gp-border); background: #fff; }
.gp-header__mobile.is-open { display: block; }
.gp-header__mobile a { display: block; padding: 11px 2px; font-weight: 600; color: var(--gp-text-2); border-bottom: 1px solid rgba(14,30,58,.05); text-decoration: none; }
@media (max-width: 980px) {
  .gp-header__nav, .gp-header__actions .gp-hide-mobile { display: none; }
  .gp-header__burger { display: flex; }
}

/* ── Rodapé padrão (mesmo do site) ───────────────────────────────────── */
.gp-footer { margin-top: 52px; background: var(--gp-footer); color: #fff; font-family: var(--gp-font-body); }
.gp-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 30px; padding-top: 42px; padding-bottom: 28px; }
.gp-footer__logo { height: 28px; width: auto; }
.gp-footer__about { font-size: 13px; color: var(--gp-on-dark); line-height: 1.6; margin: 14px 0 0; max-width: 280px; }
.gp-footer__title { font-weight: 700; font-size: 14px; margin-bottom: 12px; color: #fff; }
.gp-footer__links { display: flex; flex-direction: column; gap: 9px; font-size: 13.5px; color: var(--gp-on-dark); }
.gp-footer__links a, .gp-footer__links span { color: var(--gp-on-dark); display: flex; align-items: center; gap: 7px; text-decoration: none; }
.gp-footer__links a:hover { color: #fff; }
.gp-footer__links .gp-ms { font-size: 17px; }
.gp-footer__bottom { border-top: 1px solid rgba(255,255,255,.07); }
.gp-footer__bottom-row {
  display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between;
  padding-top: 16px; padding-bottom: 16px; font-size: 12.5px; color: var(--gp-on-dark-3);
}
.gp-footer__bottom-row a { color: var(--gp-on-dark-3); text-decoration: none; }
.gp-footer__bottom-row a:hover { color: #fff; }
@media (max-width: 980px) { .gp-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .gp-footer__grid { grid-template-columns: 1fr; } }