/* --------------------------------------------------
   Fonts
-------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&family=Montserrat:wght@600;700&display=swap');

/* --------------------------------------------------
   Base
-------------------------------------------------- */
body {
  font-family: 'Roboto', sans-serif;
  color: #333333;
}

/* --------------------------------------------------
   Página /download
-------------------------------------------------- */
.descargar2 { margin: 30px 0; }

/* Header do download */
.header-descargar {
  display:flex; align-items:center; justify-content:center; gap:20px;
  padding:20px; width:80%; margin:0 auto 2em auto;
  background-color:#f0f4f8; border-radius:10px;
  box-shadow:0 4px 12px rgba(0,0,0,0.05);
}
.header-descargar img { width:60px; height:60px; border-radius:12px; }
.header-descargar h1 {
  font-family:'Montserrat',sans-serif; font-size:26px; color:#333; text-align:center; margin:0;
}

/* Bloco de redirecionamento */
.redirect {
  background:#fff; border:2px solid #e0e7ff; text-align:center;
  padding:25px; margin-bottom:2em; border-radius:8px;
  box-shadow:0 4px 8px rgba(0,0,0,0.05);
}
.redirect h2 { font-size:20px; color:#4a5568; margin-bottom:15px; }
.redirect .loading img { width:100px; height:100px; }
.redirect .notload a { color:#3182ce; text-decoration:underline; font-weight:600; }

/* Área central do redirect */
.redirect-container { text-align:center; margin-top:-50px; }
#message-container p {
  font-size:14px; color:#e11d48; font-weight:bold; margin-top:15px; text-align:center;
}
#countdown { font-weight:700; margin:8px 0; }

/* Link de fallback do redirect */
#redirect-link {
  display:inline-block; margin-top:10px; font-size:12px;
  color:#007BFF; text-align:center;
}
#redirect-link:after {
  content:' (caso o botão não funcione)'; font-size:12px;
}

/* Botão cancelar / continuar */
#cancel-redirect {
  background-color:#FF6F61; color:#fff; padding:10px 20px;
  border:none; border-radius:5px; font-size:14px; font-weight:bold;
  cursor:pointer; text-transform:uppercase; transition:all .3s ease;
}
#cancel-redirect:hover { background-color:#FF9671; color:#fff; }
#cancel-redirect.continue-download { background-color:#4CAF50; color:#fff; }
#cancel-redirect.continue-download:hover { background-color:#45A049; }

/* --------------------------------------------------
   Bloco "provider" (cartão antigo)
-------------------------------------------------- */
.provider_stats_wrapper {
  display:flex; flex-direction:column; align-items:center;
  padding:20px; flex:1 1 300px; max-width:500px; margin:20px 0;
}
.provider_stats {
  width:100%; max-width:500px; border:1px solid #e2e8f0; border-radius:8px;
  font-size:18px; box-shadow:0 4px 12px rgba(0,0,0,0.05);
  background-color:#fff; padding:20px;
}
.provider_logo { display:flex; align-items:center; gap:15px; margin-bottom:20px; }
.provider_logo img { width:60px; height:60px; border-radius:12px; }
.provider_logo a {
  font-family:'Montserrat',sans-serif; font-size:22px; color:#1a202c; text-decoration:none;
}
.provider_logo a:hover { color:#3182ce; text-decoration:underline; }

.provider_overall {
  display:flex; flex-direction:column; align-items:center; text-align:center;
  font-size:18px; background-color:#f5f5f5; padding:15px 0; border-radius:5px; margin-bottom:15px;
}
.provider_overall .oos { font-weight:700; font-size:20px; color:#2d3748; }

.star-rating { display:flex; align-items:center; }
.star-rating .star { font-size:16px; color:gold; margin-right:2px; position:relative; }
.star-rating .star.empty { color:#ccc; }
.star-rating .star.half::before {
  content:'★'; position:absolute; left:0; top:0; width:50%; overflow:hidden; color:gold;
}

.download-count { font-size:16px; color:#4a5568; margin-top:5px; }

.provider_stats_row {
  width:100%; display:flex; justify-content:space-between; margin:10px 0;
}
.provider_stats_row_left div,
.provider_stats_row_right div { font-size:16px; color:#4a5568; }

.clear { clear:both; }

/* CTA container (cartão antigo) */
.provider_visit {
  border-top:1px solid #e5e5e5; display:flex; justify-content:center; gap:15px;
  flex-wrap:wrap; padding:15px 0;
}

/* Botões padrão (cartão antigo) */
a.visit {
  display:flex; align-items:center; justify-content:center;
  padding:12px 20px; background:linear-gradient(90deg,#6a11cb 0%,#2575fc 100%);
  color:#fff !important; border-radius:8px; font-size:18px; font-weight:600;
  margin:10px; text-align:center; text-decoration:none;
  box-shadow:0 4px 8px rgba(0,0,0,0.1);
  transition:transform .2s ease, box-shadow .3s ease;
  animation:none;
}
a.visit:hover { transform:translateY(-2px); box-shadow:0 6px 12px rgba(0,0,0,0.15); }

/* Ícones de plataforma */
.platform-icon { width:24px; height:24px; margin-right:10px; }

/* --------------------------------------------------
   NOVO CARD DO PLUGIN (tema selecionável)
   Estrutura: .cl-card … + .cl-variant-*
-------------------------------------------------- */
.cl-card{
  --radius:16px;
  --border:#e6e7ea;
  --text:#2b2f38;
  --muted:#6b7280;
  --bg:#fff;
  --cta:#111827;        /* default */
  --cta-hover:#0b1220;  /* default hover */
  --tint:#f3f4f6;       /* caixas claras / rating bg */
  --tint-strong:#fafafa;

  background:var(--bg);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:0 4px 18px rgba(21,24,31,.06);
  /* FIX: não cortar lateral/sombra interna */
  overflow:visible;

  /* layout */
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, auto);
  box-sizing:border-box;
  max-width:100%;
}

/* Header do card */
.cl-header{
  display:grid; grid-template-columns:56px 1fr auto;
  align-items:center; gap:12px;
  padding:16px 16px 12px 16px;
  background:#fff; border-bottom:1px solid #f0f1f4;
  box-sizing:border-box; max-width:100%;
}
.cl-logo{ width:56px; height:56px; border-radius:12px; object-fit:cover; }
.cl-title{
  font-weight:700; line-height:1.25; color:#111827;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cl-rating{
  font-weight:700; color:#111827; background:var(--tint);
  border-radius:12px; padding:8px 12px; display:flex; align-items:center; gap:6px;
}
.cl-star{ color:#f59e0b; }

/* Specs em grade */
.cl-specs{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:0; border-bottom:1px solid #f0f1f4;
  box-sizing:border-box; max-width:100%;
}
.cl-spec{
  padding:14px 16px; display:flex; flex-direction:column; gap:4px;
  border-right:1px solid #f0f1f4; min-width:0;
  box-sizing:border-box;
}
.cl-spec:nth-child(4n){ border-right:none; }
.cl-k{ font-size:12px; color:#6b7280; }
.cl-v{ font-weight:700; color:#111827; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* CTAs */
.cl-ctas{
  display:flex; flex-direction:row; flex-wrap:wrap; gap:12px; padding:16px; background:#fff;
  justify-content:center; align-items:center;
  width:100%; box-sizing:border-box; max-width:100%;
  overflow:visible;
}
.cl-btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:48px; border-radius:12px; font-weight:700; text-decoration:none;
  transition:transform .06s ease, box-shadow .2s ease, background .2s ease;
  width:auto; flex:0 0 auto; min-width:0; box-sizing:border-box; margin:0; padding:0 24px;
}
.cl-btn:active{ transform:translateY(1px); }
.cl-btn-primary{
  background:var(--cta); color:#fff; box-shadow:0 6px 16px rgba(17,24,39,.25);
}

/* Rodapé */
/* Nota de rodapé do card */
.cl-footnote{
    text-align:center;
    font-size:.875rem;
    opacity:.85;
    margin-top:10px;
    line-height:1.4;
}

/* -----------------------------
   VARIANT: DEFAULT
------------------------------*/
.cl-variant-default .cl-btn-primary{
  background:var(--cta); color:#fff; box-shadow:0 6px 16px rgba(17,24,39,.25);
}
.cl-variant-default .cl-btn-primary:hover{ background:var(--cta-hover); }
.cl-variant-default a.visit{
  background:linear-gradient(90deg,#6a11cb 0%,#2575fc 100%) !important;
}

/* -----------------------------
   VARIANT: SOFT RED
------------------------------*/
.cl-variant-soft-red{
  --cta:#d71920;
  --cta-hover:#b31218;
  --tint:#fff1f2;
  --tint-strong:#fff7f7;
}
.cl-variant-soft-red .cl-btn-primary{
  background:var(--cta); color:#fff; box-shadow:0 6px 16px rgba(215,25,32,.25);
}
.cl-variant-soft-red .cl-btn-primary:hover{ background:var(--cta-hover); }
.cl-variant-soft-red a.visit{
  background:linear-gradient(90deg, var(--cta) 0%, var(--cta-hover) 100%) !important;
}

/* -----------------------------
   VARIANT: SOFT BLUE
------------------------------*/
.cl-variant-soft-blue{
  --cta:#2563eb;
  --cta-hover:#1d4ed8;
  --tint:#eff6ff;
  --tint-strong:#f8fbff;
}
.cl-variant-soft-blue .cl-btn-primary{
  background:var(--cta); color:#fff; box-shadow:0 6px 16px rgba(37,99,235,.25);
}
.cl-variant-soft-blue .cl-btn-primary:hover{ background:var(--cta-hover); }
.cl-variant-soft-blue a.visit{
  background:linear-gradient(90deg,#1e3a8a 0%,#2563eb 100%) !important;
}

/* -----------------------------
   VARIANT: SOFT GREEN
------------------------------*/
.cl-variant-soft-green{
  --cta:#10b981;
  --cta-hover:#059669;
  --tint:#ecfdf5;
  --tint-strong:#f6fef9;
}
.cl-variant-soft-green .cl-btn-primary{
  background:var(--cta); color:#fff; box-shadow:0 6px 16px rgba(16,185,129,.25);
}
.cl-variant-soft-green .cl-btn-primary:hover{ background:var(--cta-hover); }
.cl-variant-soft-green a.visit{
  background:linear-gradient(90deg,#22c55e 0%,#16a34a 100%) !important;
}

/* --------------------------------------------------
   Responsivo do novo card
-------------------------------------------------- */
@media (min-width: 640px){
  /* cl-ctas already flex-row by default */
}
@media (max-width: 720px){
  .cl-header{ grid-template-columns:48px 1fr; grid-template-rows:auto auto; }
  .cl-logo{ width:48px; height:48px; border-radius:10px; }
  .cl-title{ grid-column:2 / -1; }
  .cl-rating{ grid-column:1 / -1; margin-top:8px; justify-self:start; }
  .cl-specs{ grid-template-columns:1fr 1fr; }
  .cl-spec:nth-child(2n){ border-right:none; }
  .cl-card .cl-ctas{ flex-direction:column; }
  .cl-card .cl-btn{ width:100%; }
}

/* --------------------------------------------------
   Botões adicionais (opcional)
-------------------------------------------------- */
.button-container-cli{
  display:flex; flex-wrap:wrap; justify-content:space-around; gap:10px;
  max-width:600px; margin:20px auto;
}
.gradient-button-cli{
  background:linear-gradient(90deg,#52c234 0%,#0f9b0f 100%);
  color:#fff; text-decoration:none; padding:10px 20px; font-size:16px; font-weight:bold;
  border-radius:5px; display:flex; align-items:center; justify-content:space-between; flex:1 1 45%;
}
.gradient-button-cli i.arrow-right{
  border:solid #fff; border-width:0 3px 3px 0; display:inline-block; padding:3px; margin-left:10px; transform:rotate(-45deg);
}
.gradient-button-cli span{ flex-grow:1; }

/* --------------------------------------------------
   Inputs / Acessibilidade
-------------------------------------------------- */
input.error { border:2px solid #e53e3e; background-color:#fff5f5; }
input:focus {
  border:2px solid #3182ce; outline:none; box-shadow:0 0 8px rgba(49,130,206,0.5);
}
a.visit:focus-visible, button:focus-visible {
  outline:2px dashed #3182ce; outline-offset:2px;
}
a.visit:active, button:active {
  transform:scale(0.98); box-shadow:0 3px 6px rgba(0,0,0,0.1);
}

/* --------------------------------------------------
   Responsividade geral
-------------------------------------------------- */
@media (max-width: 900px){
  .header-descargar{ width:90%; }
  .provider_stats_row{ flex-direction:column; align-items:center; }
}
@media (max-width: 768px){
  #cancel-redirect{ width:100%; max-width:300px; margin:10px auto; display:block; text-align:center; }
  .redirect-container p{ text-align:center; font-size:14px; }
  #downloadTitle{ font-size:18px; text-align:center; }
  #downloadThumb{ display:block; margin:10px auto; max-width:80%; }
  .provider_stats_wrapper{ margin:20px 0; padding:10px; box-sizing:border-box; width:100%; }
}
@media (max-width: 600px){
  .provider_stats_row{ flex-direction:column; width:100%; }
  a.visit{ flex:1 1 100%; justify-content:center; }
  .header-descargar{ flex-direction:column; gap:15px; width:100%; }
  .header-descargar img{ width:50px; height:50px; }
  .header-descargar h1{ font-size:22px; text-align:center; }
}
@media (max-width: 480px){
  .provider_stats_row{ padding:10px; font-size:14px; }
  .header-descargar h1{ font-size:18px; }
}
@media only screen and (max-width: 768px){
  .redirect-container{ display:flex; flex-direction:column; align-items:center; text-align:center; }
  .redirect-container h1{ font-size:18px; margin-bottom:10px; }
  .redirect-container p{ font-size:14px; margin-bottom:10px; }
  #cancel-redirect{ width:auto; margin:15px 0; padding:10px 15px; }
  #message-container{ font-size:14px; }
  #redirect-link{ font-size:14px; }
}

/* --------------------------------------------------
   Botões de loja (imagens)
-------------------------------------------------- */
.loja-botoes-wrap{
  display:flex; flex-wrap:wrap; justify-content:center; gap:10px;
}
.loja-botoes-wrap a{ display:block; }
.loja-botoes-wrap img{
  max-width:180px; height:auto; transition:transform .2s ease;
}
.loja-botoes-wrap img:hover{ transform:scale(1.05); }
@media (max-width: 360px){
  .loja-botoes-wrap img{ max-width:140px; }
}
.loja-botoes-wrap .visit{
  background:transparent !important; padding:0 !important;
}

/* --------------------------------------------------
   Compatibilidade com o cartão clássico dentro do novo
-------------------------------------------------- */
.cl-card .provider_visit{ display:block; width:100%; clear:both; }
.cl-card .provider_visit .visit{ width:100%; max-width:420px; }

/* --- Fix: botões do card ficando opacos em alguns temas --- */
.cl-card .cl-ctas{
  display:flex;
  gap:18px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
}

/* remove opacidade herdada/efeitos do tema */
.cl-card .cl-btn,
.cl-card .cl-btn-primary{
  opacity:1 !important;
  filter:none !important;
  pointer-events:auto;
}

/* garante contraste (ajuste a cor se usar variants por CSS) */
.cl-card .cl-btn-primary{
  color:#fff !important;
}
.cl-card .cl-btn-primary:visited{
  color:#fff !important;
}
/* =============================================
   RedirectApp v1.0 — NOVOS ESTILOS
   Adicionado em cima do CSS original
============================================= */

/* ---- Stars & Stats ---- */
.ra-stars{color:#f59e0b;font-size:14px;letter-spacing:1px}
.ra-rating-num{font-size:13px;color:#888;margin-left:4px}
.ra-stat{text-align:center}
.ra-stat-label{display:block;font-size:11px;color:rgba(136,136,136,.9);text-transform:uppercase;letter-spacing:.5px}
.ra-stat-value{display:block;font-size:13px;font-weight:600}

/* ---- Button base ---- */
.ra-btn{display:inline-flex;align-items:center;gap:10px;padding:12px 24px;border-radius:12px;text-decoration:none;font-size:14px;font-weight:500;color:#fff;border:none;cursor:pointer;transition:transform .2s,box-shadow .2s;line-height:1}
.ra-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.15)}
.ra-btn svg{width:20px;height:20px;fill:currentColor;flex-shrink:0}

/* B1-B10 Gradient */
.ra-btn-b1.ra-btn-gplay{background:linear-gradient(135deg,#06b6d4,#8b5cf6);color:#fff}
.ra-btn-b1.ra-btn-apple{background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff}
.ra-btn-b2.ra-btn-gplay{background:linear-gradient(135deg,#f97316,#ef4444);color:#fff}
.ra-btn-b2.ra-btn-apple{background:linear-gradient(135deg,#ef4444,#be123c);color:#fff}
.ra-btn-b3.ra-btn-gplay{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff}
.ra-btn-b3.ra-btn-apple{background:linear-gradient(135deg,#7c3aed,#a21caf);color:#fff}
.ra-btn-b4.ra-btn-gplay{background:linear-gradient(135deg,#0ea5e9,#0369a1);color:#fff}
.ra-btn-b4.ra-btn-apple{background:linear-gradient(135deg,#1e3a5f,#0c1929);color:#fff}
.ra-btn-b5.ra-btn-gplay{background:linear-gradient(135deg,#14b8a6,#0d9488);color:#fff}
.ra-btn-b5.ra-btn-apple{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}
.ra-btn-b6.ra-btn-gplay{background:linear-gradient(135deg,#ec4899,#f43f5e);color:#fff}
.ra-btn-b6.ra-btn-apple{background:linear-gradient(135deg,#be123c,#881337);color:#fff}
.ra-btn-b7.ra-btn-gplay{background:linear-gradient(135deg,#059669,#047857);color:#fff}
.ra-btn-b7.ra-btn-apple{background:linear-gradient(135deg,#b45309,#92400e);color:#fff}
.ra-btn-b8.ra-btn-gplay{background:linear-gradient(135deg,#334155,#1e293b);color:#fff}
.ra-btn-b8.ra-btn-apple{background:linear-gradient(135deg,#1e293b,#0f172a);color:#fff}
.ra-btn-b9.ra-btn-gplay{background:linear-gradient(135deg,#a855f7,#ec4899);color:#fff}
.ra-btn-b9.ra-btn-apple{background:linear-gradient(135deg,#06b6d4,#3b82f6);color:#fff}
.ra-btn-b10.ra-btn-gplay{background:linear-gradient(135deg,#dc2626,#7f1d1d);color:#fff}
.ra-btn-b10.ra-btn-apple{background:linear-gradient(135deg,#1c1917,#0c0a09);color:#fff}

/* C1-C5 Outline pill */
.ra-btn-c1,.ra-btn-c2,.ra-btn-c3,.ra-btn-c4,.ra-btn-c5{border-radius:50px;background:transparent;border:2px solid;transition:transform .2s,background .25s,color .25s}
.ra-btn-c1:hover,.ra-btn-c2:hover,.ra-btn-c3:hover,.ra-btn-c4:hover,.ra-btn-c5:hover{transform:scale(1.05)}
.ra-btn-c1.ra-btn-gplay{border-color:#8b5cf6;color:#8b5cf6}.ra-btn-c1.ra-btn-gplay:hover{background:#8b5cf6;color:#fff}
.ra-btn-c1.ra-btn-apple{border-color:#ec4899;color:#ec4899}.ra-btn-c1.ra-btn-apple:hover{background:#ec4899;color:#fff}
.ra-btn-c1 svg{fill:#8b5cf6}.ra-btn-c1:hover svg{fill:#fff}
.ra-btn-c2.ra-btn-gplay,.ra-btn-c2.ra-btn-apple{border-color:#0d9488;color:#0d9488}
.ra-btn-c2:hover{background:#0d9488!important;color:#fff!important}.ra-btn-c2 svg{fill:#0d9488}.ra-btn-c2:hover svg{fill:#fff}
.ra-btn-c3.ra-btn-gplay,.ra-btn-c3.ra-btn-apple{border-color:#ea580c;color:#ea580c}
.ra-btn-c3:hover{background:#ea580c!important;color:#fff!important}.ra-btn-c3 svg{fill:#ea580c}.ra-btn-c3:hover svg{fill:#fff}
.ra-btn-c4.ra-btn-gplay,.ra-btn-c4.ra-btn-apple{border-color:#374151;color:#374151}
.ra-btn-c4:hover{background:#374151!important;color:#fff!important}.ra-btn-c4 svg{fill:#374151}.ra-btn-c4:hover svg{fill:#fff}
.ra-btn-c5.ra-btn-gplay,.ra-btn-c5.ra-btn-apple{border-color:#2563eb;color:#2563eb}
.ra-btn-c5:hover{background:#2563eb!important;color:#fff!important}.ra-btn-c5 svg{fill:#2563eb}.ra-btn-c5:hover svg{fill:#fff}

/* E2,E4,E5 Stacked */
.ra-btn-e2,.ra-btn-e4,.ra-btn-e5{flex-direction:column;align-items:center;gap:6px;padding:16px 28px;border-radius:16px;min-width:150px}
.ra-btn-e2:hover,.ra-btn-e4:hover,.ra-btn-e5:hover{transform:translateY(-3px)}
.ra-btn-e2 svg,.ra-btn-e4 svg,.ra-btn-e5 svg{width:28px;height:28px}
.ra-btn-e2 span,.ra-btn-e4 span,.ra-btn-e5 span{display:block;text-align:center}
.ra-btn-e2.ra-btn-gplay,.ra-btn-e2.ra-btn-apple{background:linear-gradient(135deg,#1e293b,#0f172a);color:#e2e8f0;border:1px solid #334155}
.ra-btn-e2.ra-btn-gplay svg{fill:#38bdf8}.ra-btn-e2.ra-btn-apple svg{fill:#f1f5f9}
.ra-btn-e4.ra-btn-gplay{background:linear-gradient(135deg,#fff7ed,#ffedd5);color:#9a3412;border:1px solid #fdba74}.ra-btn-e4.ra-btn-gplay svg{fill:#ea580c}
.ra-btn-e4.ra-btn-apple{background:linear-gradient(135deg,#fef2f2,#fecaca);color:#991b1b;border:1px solid #fca5a5}.ra-btn-e4.ra-btn-apple svg{fill:#dc2626}
.ra-btn-e5.ra-btn-gplay{background:linear-gradient(135deg,#0f172a,#1e1b4b);color:#a5b4fc;border:1px solid #4338ca}.ra-btn-e5.ra-btn-gplay svg{fill:#818cf8}
.ra-btn-e5.ra-btn-apple{background:linear-gradient(135deg,#1a0a2e,#2d1b69);color:#c4b5fd;border:1px solid #7c3aed}.ra-btn-e5.ra-btn-apple svg{fill:#a78bfa}

/* ---- Variant themes (novos) ---- */
.ra-variant-coral-warm{--ra-bg:linear-gradient(135deg,#fef2f2,#fecaca);--ra-accent:#ef4444;--ra-text:#1a1a1a;--ra-muted:#b91c1c}
.ra-variant-mint-fresh{--ra-bg:linear-gradient(135deg,#f0fdf4,#bbf7d0);--ra-accent:#22c55e;--ra-text:#1a1a1a;--ra-muted:#15803d}
.ra-variant-ocean-blue{--ra-bg:linear-gradient(135deg,#eff6ff,#bfdbfe);--ra-accent:#3b82f6;--ra-text:#1a1a1a;--ra-muted:#1d4ed8}
.ra-variant-royal-purple{--ra-bg:linear-gradient(135deg,#faf5ff,#e9d5ff);--ra-accent:#8b5cf6;--ra-text:#1a1a1a;--ra-muted:#7c3aed}
.ra-variant-sunset-orange{--ra-bg:linear-gradient(135deg,#fff7ed,#fed7aa);--ra-accent:#f97316;--ra-text:#1a1a1a;--ra-muted:#c2410c}
.ra-variant-pink-glow{--ra-bg:linear-gradient(135deg,#fdf4ff,#f0abfc);--ra-accent:#d946ef;--ra-text:#1a1a1a;--ra-muted:#a21caf}
.ra-variant-midnight-dark{--ra-bg:linear-gradient(135deg,#0f0c29,#302b63);--ra-accent:#6366f1;--ra-text:#e0e7ff;--ra-muted:#a5b4fc}
.ra-variant-emerald{--ra-bg:linear-gradient(135deg,#ecfdf5,#a7f3d0);--ra-accent:#10b981;--ra-text:#1a1a1a;--ra-muted:#047857}
.ra-variant-cyber-red{--ra-bg:linear-gradient(135deg,#1a1a2e,#e94560);--ra-accent:#e94560;--ra-text:#fecdd3;--ra-muted:#fda4af}
.ra-variant-clean-white{--ra-bg:#fff;--ra-accent:#000;--ra-text:#1a1a1a;--ra-muted:#666}
/* legados com prefixo ra- */
.ra-variant-soft-red{--ra-bg:linear-gradient(135deg,#fef2f2,#fecaca);--ra-accent:#ef4444;--ra-text:#1a1a1a;--ra-muted:#991b1b}
.ra-variant-soft-green{--ra-bg:linear-gradient(135deg,#f0fdf4,#bbf7d0);--ra-accent:#22c55e;--ra-text:#1a1a1a;--ra-muted:#166534}
.ra-variant-soft-blue{--ra-bg:linear-gradient(135deg,#eff6ff,#bfdbfe);--ra-accent:#3b82f6;--ra-text:#1a1a1a;--ra-muted:#1e40af}

/* ---- NEW LAYOUTS ---- */
.ra-layout-horizontal{background:var(--ra-bg,#fef2f2);border-radius:12px;padding:16px;color:var(--ra-text,#1a1a1a)}
.ra-hz-wrap{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.ra-hz-icon{width:64px;height:64px;border-radius:14px;object-fit:cover;flex-shrink:0}
.ra-hz-info{flex:1;min-width:150px}.ra-hz-title{font-size:16px;font-weight:600;margin-bottom:2px}
.ra-hz-author{font-size:12px;color:var(--ra-muted,#666);margin-bottom:4px}.ra-hz-meta{font-size:13px}
.ra-hz-buttons{display:flex;gap:8px;flex-wrap:wrap}

.ra-layout-hero{border-radius:16px;overflow:hidden;max-width:400px;margin:20px auto;border:1px solid rgba(0,0,0,.08)}
.ra-hero-banner{background:var(--ra-bg,linear-gradient(135deg,#667eea,#764ba2));height:80px}
.ra-hero-body{padding:36px 20px 20px;background:#fff;position:relative;color:#1a1a1a}
.ra-hero-icon{position:absolute;top:-28px;left:20px;width:56px;height:56px;border-radius:14px;border:3px solid #fff;object-fit:cover}
.ra-hero-title{font-size:18px;font-weight:600}.ra-hero-author{font-size:13px;color:#888;margin:4px 0 12px}
.ra-hero-stats{display:flex;gap:20px;margin-bottom:16px}.ra-hero-buttons{display:flex;gap:8px;flex-wrap:wrap}

.ra-layout-glass{border-radius:16px;overflow:hidden}
.ra-glass-bg{background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);padding:24px}
.ra-glass-inner{background:rgba(255,255,255,.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:20px;max-width:380px;margin:0 auto}
.ra-glass-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.ra-glass-icon{width:52px;height:52px;border-radius:12px;object-fit:cover;flex-shrink:0}
.ra-glass-hinfo{flex:1}.ra-glass-title{font-size:17px;font-weight:600;color:#fff}
.ra-glass-author{font-size:12px;color:rgba(255,255,255,.6)}
.ra-glass-price{background:rgba(255,255,255,.15);padding:4px 10px;border-radius:20px;font-size:12px;color:#fff}
.ra-glass-stats{display:flex;justify-content:space-around;margin-bottom:16px;padding:12px 0;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}
.ra-glass-stats .ra-stat-label{color:rgba(255,255,255,.5)}.ra-glass-stats .ra-stat-value{color:#fff}
.ra-glass-stats .ra-stars{color:#f59e0b}.ra-glass-stats .ra-rating-num{color:rgba(255,255,255,.7)}
.ra-glass-buttons{display:flex;gap:8px;flex-wrap:wrap}
.ra-layout-glass .ra-btn{background:rgba(255,255,255,.15)!important;color:#fff!important;border:1px solid rgba(255,255,255,.2)}
.ra-layout-glass .ra-btn svg{fill:#fff!important}.ra-layout-glass .ra-btn:hover{background:rgba(255,255,255,.25)!important}

.ra-layout-sidebar{display:flex;border-radius:12px;overflow:hidden;max-width:440px;margin:20px auto;border:1px solid rgba(0,0,0,.08);background:#fff}
.ra-sb-accent{width:5px;flex-shrink:0;background:linear-gradient(180deg,var(--ra-accent,#f43f5e),#ec4899)}
.ra-sb-body{padding:16px 18px;flex:1}
.ra-sb-header{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.ra-sb-icon{width:48px;height:48px;border-radius:12px;object-fit:cover;flex-shrink:0}
.ra-sb-hinfo{flex:1}.ra-sb-title{font-size:16px;font-weight:600;color:#1a1a1a}.ra-sb-meta{font-size:12px;color:#999}
.ra-sb-price{background:#f0fdf4;color:#16a34a;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:500;white-space:nowrap}
.ra-sb-buttons{display:flex;gap:8px;flex-wrap:wrap}

.ra-layout-fullcta{max-width:420px;margin:20px auto;border-radius:16px;overflow:hidden;border:1px solid rgba(0,0,0,.08);background:#fff}
.ra-fc-body{padding:20px;text-align:center;color:#1a1a1a}
.ra-fc-icon{width:72px;height:72px;border-radius:18px;object-fit:cover;margin:0 auto 12px;display:block}
.ra-fc-title{font-size:20px;font-weight:600}.ra-fc-author{font-size:13px;color:#888;margin:4px 0 8px}
.ra-fc-stats{font-size:14px;margin-bottom:16px;color:#666}.ra-fc-stats .ra-stars{font-size:15px}
.ra-fc-sep{color:#ddd;margin:0 6px}
.ra-fc-buttons{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.ra-fc-buttons .ra-btn{justify-content:center;width:100%}
.ra-fc-footnote{font-size:11px;color:#bbb;margin-top:12px}

.ra-layout-floating{padding:16px}
.ra-fl-inner{max-width:400px;margin:0 auto;background:#fff;border-radius:20px;padding:20px;box-shadow:0 4px 24px rgba(0,0,0,.08)}
.ra-fl-header{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px}
.ra-fl-icon{width:60px;height:60px;border-radius:15px;object-fit:cover;flex-shrink:0}
.ra-fl-hinfo{flex:1}.ra-fl-title{font-size:17px;font-weight:600;color:#1a1a1a}
.ra-fl-author{font-size:13px;color:#999}.ra-fl-stars{margin-top:4px}
.ra-fl-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:12px 0;border-top:1px solid #f3f4f6;margin-bottom:16px}
.ra-fl-stats .ra-stat-value{color:#333}
.ra-fl-buttons{display:flex;gap:8px;flex-wrap:wrap}

.ra-layout-neon{border-radius:16px;overflow:hidden}
.ra-neo-inner{background:linear-gradient(135deg,#0f0c29,#302b63,#24243e);padding:24px;max-width:420px;margin:0 auto}
.ra-neo-header{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.ra-neo-icon{width:56px;height:56px;border-radius:14px;object-fit:cover;flex-shrink:0}
.ra-neo-hinfo{flex:1}.ra-neo-title{font-size:18px;font-weight:600;color:#fff}
.ra-neo-sub{font-size:12px;color:rgba(255,255,255,.5)}
.ra-neo-sub .ra-stars{color:#f59e0b}.ra-neo-sub .ra-rating-num{color:rgba(255,255,255,.6)}
.ra-neo-stats{display:flex;gap:12px;padding:14px 0;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:16px}
.ra-neo-stats .ra-stat{flex:1}.ra-neo-stats .ra-stat-label{color:rgba(255,255,255,.4)}.ra-neo-stats .ra-stat-value{color:#fff;font-size:15px}
.ra-neo-buttons{display:flex;gap:10px;flex-wrap:wrap}
.ra-layout-neon .ra-btn-gplay{background:linear-gradient(135deg,#00c853,#00e676)!important;color:#000!important}
.ra-layout-neon .ra-btn-gplay svg{fill:#000!important}
.ra-layout-neon .ra-btn-apple{background:linear-gradient(135deg,#667eea,#764ba2)!important;color:#fff!important}
.ra-layout-neon .ra-btn-apple svg{fill:#fff!important}

/* Responsive novos layouts */
@media(max-width:480px){
  .ra-hz-wrap{flex-direction:column;text-align:center}
  .ra-hz-buttons{justify-content:center;width:100%}.ra-hz-buttons .ra-btn{flex:1;justify-content:center}
  .ra-fl-stats{grid-template-columns:repeat(2,1fr)}
  .ra-hero-stats{flex-wrap:wrap;gap:10px}
  .ra-btn{padding:10px 18px;font-size:13px}
  .ra-btn-e2,.ra-btn-e4,.ra-btn-e5{padding:12px 20px;min-width:130px}
  .ra-sb-header{flex-wrap:wrap}
  .ra-neo-stats{flex-wrap:wrap}.ra-neo-stats .ra-stat{flex:0 0 calc(50% - 6px)}
  .ra-fc-buttons,.ra-hero-buttons,.ra-glass-buttons,.ra-sb-buttons,.ra-fl-buttons,.ra-neo-buttons{flex-direction:column}
  .ra-fc-buttons .ra-btn,.ra-hero-buttons .ra-btn,.ra-glass-buttons .ra-btn,.ra-sb-buttons .ra-btn,.ra-fl-buttons .ra-btn,.ra-neo-buttons .ra-btn{width:100%;justify-content:center}
}

/* =============================================
   FORCE: Botões SEMPRE lado a lado no desktop
   Sobrescreve qualquer regra conflitante
============================================= */
.cl-card .cl-ctas{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:wrap !important;
  gap:12px !important;
  justify-content:center !important;
}
.cl-card .cl-ctas .cl-btn,
.cl-card .cl-ctas .cl-btn-primary{
  width:auto !important;
  flex:0 0 auto !important;
}
.ra-glass-buttons,
.ra-hero-buttons,
.ra-hz-buttons,
.ra-sb-buttons,
.ra-fl-buttons,
.ra-neo-buttons,
.ra-fc-buttons{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:wrap !important;
  justify-content:center !important;
}
.ra-glass-buttons .ra-btn,
.ra-hero-buttons .ra-btn,
.ra-hz-buttons .ra-btn,
.ra-sb-buttons .ra-btn,
.ra-fl-buttons .ra-btn,
.ra-neo-buttons .ra-btn,
.ra-fc-buttons .ra-btn{
  width:auto !important;
  flex:0 0 auto !important;
}

/* Mobile: empilhar */
@media(max-width:720px){
  .cl-card .cl-ctas{flex-direction:column !important}
  .cl-card .cl-ctas .cl-btn{width:100% !important}
  .ra-glass-buttons,.ra-hero-buttons,.ra-hz-buttons,.ra-sb-buttons,.ra-fl-buttons,.ra-neo-buttons,.ra-fc-buttons{flex-direction:column !important}
  .ra-glass-buttons .ra-btn,.ra-hero-buttons .ra-btn,.ra-hz-buttons .ra-btn,.ra-sb-buttons .ra-btn,.ra-fl-buttons .ra-btn,.ra-neo-buttons .ra-btn,.ra-fc-buttons .ra-btn{width:100% !important}
}