/**
 * MATOGROSSO JÁ — Modal de compartilhamento (5 tipos: reel, carrossel, story, card, tweet).
 * Tudo scoped a .dj-share-overlay pra não vazar pro resto do tema.
 *
 * Dimensões idênticas em todos os tipos: 920×580.
 * Só o preview muda. Tipografia/spacings padronizados.
 */

/* ============== OVERLAY + BACKDROP ============== */
.dj-share-overlay{
  position:fixed;inset:0;
  z-index:999999 !important;
  display:none;
  align-items:center;justify-content:center;
  padding:20px;
  background:rgba(2,4,18,0.78);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  opacity:0;
  transition:opacity 0.32s cubic-bezier(0.22,1,0.36,1);

  /* Tokens scoped para o modal — evita conflito com main.css */
  --ink:#050926;
  --ink-2:#0a1140;
  --gold:#ffd700;
  --gold-soft:#ffea7a;
  --brand:#1a3aff;
  --brand-deep:#0d2ca3;
  --brand-glow:#4a66ff;
  --green:#00b347;
  --green-deep:#009739;
  --whatsapp:#25D366;
  --danger:#ff3344;
  --text:rgba(255,255,255,0.96);
  --text-soft:rgba(255,255,255,0.62);
  --text-mute:rgba(255,255,255,0.4);
  --surface:rgba(255,255,255,0.04);
  --surface-2:rgba(255,255,255,0.07);
  --border:rgba(255,255,255,0.08);
  --font-display:"Big Shoulders Display",Impact,sans-serif;
  --font-body:"Satoshi","Inter",sans-serif;
  --ease-spring:cubic-bezier(0.34,1.56,0.64,1);
  --ease-build:cubic-bezier(0.22,1,0.36,1);
}
.dj-share-overlay.is-open{display:flex;opacity:1}
.dj-share-overlay [hidden]{display:none !important}
.dj-share-overlay *{box-sizing:border-box}
.dj-share-overlay button{font:inherit;background:none;border:0;cursor:pointer;color:inherit}
.dj-share-overlay a{color:inherit;text-decoration:none}
.dj-share-overlay img,.dj-share-overlay svg{display:block;max-width:100%}

body.dj-modal-open{overflow:hidden}
body.dj-modal-open .djnew-topnav{z-index:0 !important; opacity:0 !important; pointer-events:none !important;}
body.dj-lead-open{overflow:hidden}

/* ============== MODAL BASE — DIMENSÕES IDÊNTICAS PRA TODOS ============== */
.dj-share-overlay .fmodal{
  position:relative;width:100%;max-width:920px;
  height:580px;
  background:linear-gradient(180deg,#0a1140 0%,#050926 100%);
  border-radius:22px;overflow:hidden;
  box-shadow:0 40px 100px rgba(0,0,0,0.6),0 0 0 1px var(--border);
  display:grid;grid-template-columns:340px 1fr;gap:0;
  font-family:var(--font-body);
  color:var(--text);
  line-height:1.5;
}
@media (max-width:880px){
  .dj-share-overlay .fmodal{grid-template-columns:1fr;height:auto;max-height:90vh;overflow-y:auto}
}

.dj-share-overlay .fmodal-preview{
  position:relative;width:340px;height:580px;
  background:#000;overflow:hidden;
  border-right:1px solid rgba(255,255,255,0.06);
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
}
.dj-share-overlay .fmodal-preview iframe,
.dj-share-overlay .fmodal-preview video{
  width:100%;
  height:100%;
  object-fit:contain;
  background:#000;
}
@media (max-width:880px){
  .dj-share-overlay .fmodal-preview{width:100%;height:380px;border-right:0;border-bottom:1px solid rgba(255,255,255,0.06)}
}

.dj-share-overlay .fmodal-info{
  height:auto;
  min-height:580px;
  padding:24px 26px 22px;
  display:flex;flex-direction:column;gap:14px;
  overflow-y:auto;
  overflow-x:hidden;
  zoom: 0.85;
}
@media (max-width:880px){.dj-share-overlay .fmodal-info{height:auto;padding:22px}}

/* CLOSE button */
.dj-share-overlay .fmodal-close{
  position:absolute;top:14px;right:14px;
  width:40px;height:40px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(2,4,18,0.86);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,0.18);cursor:pointer;z-index:20;
  transition:background 0.2s ease,transform 0.3s var(--ease-spring);
  color:var(--text);
  box-shadow:0 10px 28px rgba(0,0,0,0.42);
}
.dj-share-overlay .fmodal-close:hover{background:rgba(255,255,255,0.15);transform:rotate(90deg)}
.dj-share-overlay .fmodal-close svg{width:16px;height:16px}
.dj-share-overlay .fmodal-close::before,
.dj-share-overlay .fmodal-close::after{
  content:'';
  position:absolute;
  width:18px;
  height:2px;
  border-radius:999px;
  background:#fff;
}
.dj-share-overlay .fmodal-close::before{transform:rotate(45deg)}
.dj-share-overlay .fmodal-close::after{transform:rotate(-45deg)}

/* TAG */
.dj-share-overlay .fmodal-tag{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 11px;border-radius:999px;
  font-size:0.66rem;font-weight:800;
  letter-spacing:0.12em;text-transform:uppercase;
  background:var(--gold);color:var(--ink);
  font-family:var(--font-body);
  align-self:flex-start;
}
.dj-share-overlay .fmodal-tag svg{width:12px;height:12px}
.dj-share-overlay .fmodal-tag--reel{background:#ff3344;color:#fff}
.dj-share-overlay .fmodal-tag--carro{background:var(--brand);color:#fff}
.dj-share-overlay .fmodal-tag--story{background:linear-gradient(135deg,#f09433,#dc2743,#bc1888);color:#fff}
.dj-share-overlay .fmodal-tag--card{background:var(--gold);color:var(--ink)}
.dj-share-overlay .fmodal-tag--tweet{background:#000;color:#fff;border:1px solid #2a2a2a}

/* TITLE */
.dj-share-overlay .fmodal-title{
  font-family:var(--font-display);
  font-size:1.35rem;font-weight:900;
  line-height:1.08;letter-spacing:-0.01em;
  color:var(--text);
  margin:0;
}

/* SECTION */
.dj-share-overlay .fmodal-section{display:flex;flex-direction:column;gap:7px}
.dj-share-overlay .fmodal-section + .fmodal-section{padding-top:12px;border-top:1px solid rgba(255,255,255,0.06)}
.dj-share-overlay .fmodal-label{font-size:0.66rem;font-weight:800;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-mute)}

/* WHATSAPP primary CTA */
.dj-share-overlay .fmodal-wa{
  display:inline-flex;align-items:center;gap:12px;
  padding:11px 24px 11px 14px;border-radius:12px;
  background:linear-gradient(135deg, #ff7e00 0%, #e65c00 100%);
  color:#fff;text-decoration:none;font-weight:700;
  transition:transform 0.25s var(--ease-spring),box-shadow 0.25s ease;
  cursor:pointer;
  width: max-content;
}
.dj-share-overlay .fmodal-wa:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(230,92,0,0.4)}
.dj-share-overlay .fmodal-wa-icon{width:32px;height:32px;border-radius:8px;background:rgba(255,255,255,0.18);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.dj-share-overlay .fmodal-wa-icon svg{width:18px;height:18px;color:#fff}
.dj-share-overlay .fmodal-wa-icon::before{
  content:'';
  width:18px;
  height:18px;
  display:block;
  background:#fff;
  -webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 16c-.79 0-1.5.31-2.03.81L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92s2.92-1.31 2.92-2.92-1.31-2.92-2.92-2.92z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 16c-.79 0-1.5.31-2.03.81L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92s2.92-1.31 2.92-2.92-1.31-2.92-2.92-2.92z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.dj-share-overlay .fmodal-wa-text{flex:none;line-height:1.2}
.dj-share-overlay .fmodal-wa-text strong{display:block;font-size:0.86rem}
.dj-share-overlay .fmodal-wa-text span{font-size:0.68rem;opacity:0.85;font-weight:500}
.dj-share-overlay .fmodal-wa-arrow svg{width:16px;height:16px}

/* SOCIAL grid — botões pixel-fixed 44×44 */
.dj-share-overlay .fmodal-socials{
  display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;
}
.dj-share-overlay .fmodal-social{
  width:54px;height:54px;flex:0 0 54px;
  border-radius:13px;
  display:inline-flex;align-items:center;justify-content:center;
  text-decoration:none;
  border:1px solid var(--border);
  transition:transform 0.22s var(--ease-spring),filter 0.2s ease,box-shadow 0.2s ease;
  cursor:pointer;padding:0;box-sizing:border-box;
}
.dj-share-overlay .fmodal-social:hover{transform:translateY(-2px);filter:brightness(1.12);box-shadow:0 8px 18px rgba(0,0,0,0.35)}
.dj-share-overlay .fmodal-social img,.dj-share-overlay .fmodal-social svg{
  width:24px;height:24px;display:block;
  filter:brightness(0) invert(1);
}
.dj-share-overlay .fmodal-social span{
  display:block;
  color:#fff;
  font-size:0.92rem;
  font-weight:900;
  letter-spacing:0;
  line-height:1;
}
.dj-share-overlay .fmodal-social--ig{background:linear-gradient(135deg,#f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);border-color:transparent}
.dj-share-overlay .fmodal-social--ig span{
  width:20px;
  height:20px;
  font-size:0;
  background:#fff;
  -webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.8 2h8.4C19.4 2 22 4.6 22 7.8v8.4c0 3.2-2.6 5.8-5.8 5.8H7.8C4.6 22 2 19.4 2 16.2V7.8C2 4.6 4.6 2 7.8 2Zm-.2 2A3.6 3.6 0 0 0 4 7.6v8.8A3.6 3.6 0 0 0 7.6 20h8.8a3.6 3.6 0 0 0 3.6-3.6V7.6A3.6 3.6 0 0 0 16.4 4H7.6Zm9.65 1.5a1.25 1.25 0 1 1 0 2.5 1.25 1.25 0 0 1 0-2.5ZM12 7a5 5 0 1 1 0 10 5 5 0 0 1 0-10Zm0 2a3 3 0 1 0 0 6 3 3 0 0 0 0-6Z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.8 2h8.4C19.4 2 22 4.6 22 7.8v8.4c0 3.2-2.6 5.8-5.8 5.8H7.8C4.6 22 2 19.4 2 16.2V7.8C2 4.6 4.6 2 7.8 2Zm-.2 2A3.6 3.6 0 0 0 4 7.6v8.8A3.6 3.6 0 0 0 7.6 20h8.8a3.6 3.6 0 0 0 3.6-3.6V7.6A3.6 3.6 0 0 0 16.4 4H7.6Zm9.65 1.5a1.25 1.25 0 1 1 0 2.5 1.25 1.25 0 0 1 0-2.5ZM12 7a5 5 0 1 1 0 10 5 5 0 0 1 0-10Zm0 2a3 3 0 1 0 0 6 3 3 0 0 0 0-6Z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.dj-share-overlay .fmodal-social--x{background:#000}
.dj-share-overlay .fmodal-social--fb{background:#1877f2;border-color:transparent}
.dj-share-overlay .fmodal-social--tk{background:#000;border-color:transparent}
.dj-share-overlay .fmodal-social--tg{background:linear-gradient(135deg,#2AABEE,#229ED9);border-color:transparent}
.dj-share-overlay .fmodal-social--th{background:#000}
.dj-share-overlay .fmodal-social--cp{background:var(--surface-2);border-color:var(--border)}
.dj-share-overlay .fmodal-social--cp.is-copied{background:var(--green-deep);border-color:var(--green-deep)}

/* ============== LEAD GATE ============== */
.dj-lead-gate{
  position:fixed;
  inset:0;
  z-index:10020;
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(2,4,18,0.82);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  font-family:"Satoshi","Inter",sans-serif;
}
.dj-lead-gate.is-open{display:flex}
.dj-lead-gate *{box-sizing:border-box}
.dj-lead-gate__backdrop{position:absolute;inset:0}
.dj-lead-gate__card{
  position:relative;
  width:min(100%,520px);
  max-height:92vh;
  overflow:auto;
  border-radius:22px;
  padding:28px;
  background:linear-gradient(180deg,#0a1140 0%,#050926 100%);
  color:#fff;
  border:1px solid rgba(255,255,255,0.1);
  box-shadow:0 34px 90px rgba(0,0,0,0.62);
}
.dj-lead-gate__close{
  position:absolute;
  top:14px;
  right:14px;
  width:38px;
  height:38px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,0.18);
  background:rgba(2,4,18,0.72);
  cursor:pointer;
}
.dj-lead-gate__close::before,
.dj-lead-gate__close::after{
  content:'';
  position:absolute;
  left:10px;
  top:18px;
  width:17px;
  height:2px;
  border-radius:999px;
  background:#fff;
}
.dj-lead-gate__close::before{transform:rotate(45deg)}
.dj-lead-gate__close::after{transform:rotate(-45deg)}
.dj-lead-gate__eyebrow{
  margin:0 48px 8px 0;
  color:#ffd700;
  font-size:0.72rem;
  font-weight:900;
  letter-spacing:0.16em;
  text-transform:uppercase;
}
.dj-lead-gate__title{
  margin:0;
  max-width:420px;
  font-family:"Big Shoulders Display",Impact,sans-serif;
  font-size:2.08rem;
  line-height:0.96;
  text-transform:uppercase;
}
.dj-lead-gate__text{
  margin:12px 0 18px;
  color:rgba(255,255,255,0.68);
  line-height:1.5;
}
.dj-lead-gate__form{display:grid;gap:12px}
.dj-lead-gate__form label{display:grid;gap:6px}
.dj-lead-gate__form label span{
  font-size:0.72rem;
  font-weight:800;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.72);
}
.dj-lead-gate__form input,
.dj-lead-gate__form select{
  width:100%;
  min-height:46px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.06);
  color:#fff;
  padding:0 14px;
  outline:none;
  font:inherit;
  color-scheme:dark;
}
.dj-lead-gate__form select{
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none'><path d='M1 1l5 5 5-5' stroke='%23ffd700' stroke-width='1.6' stroke-linecap='round'/></svg>");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:12px 8px;
  padding-right:36px;
}
.dj-lead-gate__form select option{
  background:#070d32;
  color:#fff;
}
.dj-lead-gate__form select:disabled{
  opacity:0.58;
  cursor:not-allowed;
}
.dj-lead-gate__form input:focus,
.dj-lead-gate__form select:focus{
  border-color:rgba(255,215,0,0.65);
  box-shadow:0 0 0 3px rgba(255,215,0,0.12);
}
.dj-lead-gate__row{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:10px;
}
.dj-lead-gate__check{
  display:flex !important;
  grid-template-columns:none !important;
  align-items:flex-start;
  gap:10px !important;
  margin-top:2px;
}
.dj-lead-gate__check input{
  width:18px;
  height:18px;
  min-height:18px;
  margin-top:2px;
  accent-color:#ffd700;
  flex:0 0 18px;
}
.dj-lead-gate__check span{
  font-size:0.78rem !important;
  line-height:1.35;
  text-transform:none !important;
  letter-spacing:0 !important;
  color:rgba(255,255,255,0.72) !important;
}
.dj-lead-gate__submit{
  min-height:50px;
  border:0;
  border-radius:999px;
  margin-top:4px;
  background:linear-gradient(135deg,#ffd700,#ffed77);
  color:#050926;
  font:inherit;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 16px 36px rgba(255,215,0,0.22);
}
.dj-lead-gate__submit:disabled{opacity:0.64;cursor:wait}
.dj-lead-gate__error,
.dj-lead-gate__status{
  padding:10px 12px;
  border-radius:10px;
  font-size:0.86rem;
}
.dj-lead-gate__error{
  background:rgba(255,51,68,0.14);
  border:1px solid rgba(255,51,68,0.35);
  color:#ffd5da;
}
.dj-lead-gate__status{
  background:rgba(37,211,102,0.12);
  border:1px solid rgba(37,211,102,0.32);
  color:#dfffe9;
}

@media (max-width:560px){
  .dj-lead-gate{padding:14px}
  .dj-lead-gate__card{padding:24px 18px;border-radius:18px}
  .dj-lead-gate__title{font-size:1.72rem}
  .dj-lead-gate__row{grid-template-columns:1fr}
}

/* HINT box */
.dj-share-overlay .fmodal-hint{
  margin-top:6px;min-height:24px;padding:5px 12px;
  border-radius:8px;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.06);
  display:flex;align-items:center;justify-content:center;
  font-size:0.7rem;font-weight:600;
  color:var(--text-soft);text-align:center;
  transition:color 0.18s ease,background 0.18s ease;
}
.dj-share-overlay .fmodal-hint[data-active]{color:var(--text);background:rgba(255,255,255,0.06)}

/* DOWNLOAD */
.dj-share-overlay .fmodal-dl{
  display:inline-flex;flex-direction:column;align-items:flex-start;gap:1px;
  padding:9px 14px;border-radius:10px;
  background:rgba(255,255,255,0.04);
  color:var(--gold);
  border:1px solid rgba(255,215,0,0.4);
  font-weight:800;font-size:0.82rem;
  text-decoration:none;cursor:pointer;
  transition:all 0.2s ease;align-self:flex-start;
  font-family:var(--font-body);
}
.dj-share-overlay .fmodal-dl-row{display:inline-flex;align-items:center;gap:8px}
.dj-share-overlay .fmodal-dl small{display:block;color:rgba(255,215,0,0.55);font-weight:600;font-size:0.66rem;letter-spacing:0.04em;margin-top:1px}
.dj-share-overlay .fmodal-dl:hover{background:rgba(255,215,0,0.08);border-color:var(--gold);transform:translateY(-2px);box-shadow:0 12px 24px rgba(255,215,0,0.18)}
.dj-share-overlay .fmodal-dl svg{width:14px;height:14px}
.dj-share-overlay .fmodal-dl-dual{display:flex;gap:8px;flex-wrap:wrap}
.dj-share-overlay .fmodal-dl-dual .fmodal-dl{flex:1;min-width:140px}
.dj-share-overlay .fmodal-dl--alt{background:rgba(255,255,255,0.03);color:var(--text-soft);border:1px solid var(--border)}
.dj-share-overlay .fmodal-dl--alt small{color:var(--text-mute)}
.dj-share-overlay .fmodal-dl--alt svg{color:var(--text-soft)}
.dj-share-overlay .fmodal-dl--alt:hover{background:rgba(255,255,255,0.06);color:var(--text);border-color:rgba(255,255,255,0.2);box-shadow:none}

/* CAPTION */
.dj-share-overlay .fmodal-caption{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:10px;
  padding:9px 12px;
  font-size:0.84rem;color:var(--text);line-height:1.42;
  resize:vertical;width:100%;font-family:var(--font-body);
  min-height:74px;
}
.dj-share-overlay .fmodal-caption:focus{outline:2px solid var(--gold);outline-offset:2px;border-color:transparent}
.dj-share-overlay .fmodal-caption-row{
  display:flex;align-items:center;justify-content:space-between;
  font-size:0.66rem;color:var(--text-mute);letter-spacing:0.04em;
}
.dj-share-overlay .fmodal-caption-row button{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 10px;border-radius:7px;
  background:rgba(255,255,255,0.05);
  color:var(--text);border:1px solid var(--border);
  font-size:0.72rem;font-weight:600;
  transition:all 0.18s ease;cursor:pointer;
}
.dj-share-overlay .fmodal-caption-row button:hover{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.dj-share-overlay .fmodal-caption-row button.is-copied{background:var(--green-deep);color:#fff;border-color:var(--green-deep)}
.dj-share-overlay .fmodal-caption-row button svg{width:13px;height:13px}

/* HASHTAGS */
.dj-share-overlay .fmodal-hashtags{display:flex;flex-wrap:wrap;gap:5px}
.dj-share-overlay .fmodal-hashtag{
  font-size:0.74rem;font-weight:600;
  color:var(--brand-glow);
  background:rgba(74,102,255,0.08);
  padding:2px 7px;border-radius:5px;
  border:1px solid rgba(74,102,255,0.15);
}

/* PUBLISH no X (Tweet) */
.dj-share-overlay .fmodal-publish{
  display:inline-flex;align-items:center;gap:7px;
  padding:10px 18px;border-radius:999px;
  background:#fff;color:#000;
  font-weight:800;font-size:0.84rem;text-decoration:none;
  cursor:pointer;transition:background 0.18s ease,transform 0.2s var(--ease-spring);
  align-self:flex-start;
}
.dj-share-overlay .fmodal-publish:hover{background:#d6d9db;transform:translateY(-2px)}
.dj-share-overlay .fmodal-publish svg{width:14px;height:14px}

/* ========================== PREVIEWS ========================== */

/* REEL */
.dj-share-overlay .preview-reel-bg{position:absolute;inset:0;background-size:cover;background-position:center top}
.dj-share-overlay .preview-reel::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 35%,rgba(0,0,0,0.5));z-index:1}
.dj-share-overlay .preview-reel::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.45) 0%,transparent 30%,transparent 70%,rgba(0,0,0,0.85));z-index:1}
.dj-share-overlay .preview-play{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  width:78px;height:78px;border-radius:50%;
  background:rgba(255,215,0,0.95);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;z-index:3;
  animation:dj-play-pulse 2.5s ease-in-out infinite;
  box-shadow:0 14px 40px rgba(255,215,0,0.45);
}
.dj-share-overlay .preview-play:hover{transform:translate(-50%,-50%) scale(1.08)}
.dj-share-overlay .preview-play svg{width:32px;height:32px;color:var(--ink);margin-left:5px}
@keyframes dj-play-pulse{
  0%,100%{box-shadow:0 14px 40px rgba(255,215,0,0.45),0 0 0 0 rgba(255,215,0,0.4)}
  50%{box-shadow:0 14px 40px rgba(255,215,0,0.5),0 0 0 14px rgba(255,215,0,0)}
}
.dj-share-overlay .preview-progress{position:absolute;left:16px;right:16px;bottom:16px;height:3px;background:rgba(255,255,255,0.18);border-radius:2px;overflow:hidden;z-index:2}
.dj-share-overlay .preview-progress::after{content:'';position:absolute;left:0;top:0;height:100%;width:30%;background:var(--gold);box-shadow:0 0 8px rgba(255,215,0,0.5);animation:dj-prog 24s linear infinite}
@keyframes dj-prog{from{width:0} to{width:100%}}

/* CARROSSEL — formato 1:1 centrado verticalmente no preview area, letterbox preto acima/abaixo */
.dj-share-overlay .preview-carro{display:flex;flex-direction:column;justify-content:center}
.dj-share-overlay .preview-carro-stage{position:relative;width:100%;aspect-ratio:1/1;overflow:hidden;flex:0 0 auto}
.dj-share-overlay .preview-carro-slides{position:absolute;inset:0;display:flex;width:500%;animation:dj-carro-slide 10s ease-in-out infinite}
.dj-share-overlay .preview-carro-slide{flex-shrink:0;width:20%;background-size:cover;background-position:center;position:relative}
.dj-share-overlay .preview-carro-slide::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,0.65))}
.dj-share-overlay .preview-carro-slide-label{position:absolute;left:18px;right:18px;bottom:18px;color:#fff;font-family:var(--font-display);font-size:1.4rem;font-weight:900;line-height:1;letter-spacing:-0.01em;text-transform:uppercase;text-shadow:0 2px 12px rgba(0,0,0,0.5)}
@keyframes dj-carro-slide{
  0%,18%{transform:translateX(0)}
  20%,38%{transform:translateX(-20%)}
  40%,58%{transform:translateX(-40%)}
  60%,78%{transform:translateX(-60%)}
  80%,98%{transform:translateX(-80%)}
  100%{transform:translateX(0)}
}
.dj-share-overlay .preview-carro-counter{position:absolute;top:14px;right:14px;background:rgba(0,0,0,0.55);backdrop-filter:blur(8px);padding:6px 12px;border-radius:999px;font-size:0.78rem;font-weight:700;color:#fff;z-index:5;display:inline-flex;align-items:center;gap:6px}
.dj-share-overlay .preview-carro-counter svg{width:14px;height:14px}
.dj-share-overlay .preview-carro-dots{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:6px;z-index:5}
.dj-share-overlay .preview-carro-dots span{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,0.4);transition:all 0.3s ease}
.dj-share-overlay .preview-carro-dots span.is-active{background:var(--gold);width:22px;border-radius:999px}

/* STORY */
.dj-share-overlay .preview-story-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.dj-share-overlay .preview-story::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.5) 0%,transparent 25%,transparent 60%,rgba(0,0,0,0.85));pointer-events:none;z-index:1}
.dj-share-overlay .preview-story-bars{position:absolute;top:14px;left:14px;right:14px;display:flex;gap:4px;z-index:5}
.dj-share-overlay .preview-story-bars span{flex:1;height:3px;background:rgba(255,255,255,0.3);border-radius:2px;overflow:hidden}
.dj-share-overlay .preview-story-bars span.is-done{background:#fff}
.dj-share-overlay .preview-story-bars span.is-active::after{content:'';display:block;height:100%;background:#fff;animation:dj-story-bar 18s linear forwards}
@keyframes dj-story-bar{from{width:0} to{width:100%}}
.dj-share-overlay .preview-story-meta{position:absolute;top:38px;left:18px;z-index:5;display:flex;align-items:center;gap:10px;font-size:0.78rem;color:#fff}

/* CARD — formato 1:1 centrado verticalmente no preview area, letterbox preto */
.dj-share-overlay .preview-card{display:flex;align-items:center;justify-content:center;padding:14px}
.dj-share-overlay .preview-card-frame{position:relative;width:100%;height:100%;overflow:hidden;flex:1;background:#000;border-radius:16px}
.dj-share-overlay .preview-card-img{position:absolute;inset:0;background-size:contain;background-position:center;background-repeat:no-repeat}
.dj-share-overlay .preview-card-frame::after{display:none}
.dj-share-overlay .preview-card-meta{display:none}

/* TWEET */
.dj-share-overlay .preview-tweet{background:linear-gradient(135deg,#16181c 0%,#000 100%);display:flex;align-items:center;justify-content:center;padding:40px 24px}
.dj-share-overlay .preview-tweet::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 600px 400px at 50% 50%,rgba(29,155,240,0.18),transparent 70%);pointer-events:none}
.dj-share-overlay .tweet-print{
  position:relative;background:#000;border:1px solid rgb(47,51,54);
  border-radius:18px;padding:22px 20px;width:100%;max-width:280px;
  font-family:"Chirp","TwitterChirp",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:rgb(231,233,234);box-shadow:0 24px 60px rgba(29,155,240,0.18);
  display:flex;flex-direction:column;gap:12px;
}
.dj-share-overlay .tweet-print-text{font-size:16px;line-height:22px;color:rgb(231,233,234);white-space:pre-wrap;text-align:center;margin:0}
.dj-share-overlay .tweet-print-text .tag{color:rgb(29,155,240)}

/* ========================== ANIMAÇÃO STAGGER BUILD ========================== */
.dj-share-overlay [data-build]{
  opacity:0;
  transform:translateY(12px) scale(0.97);
  filter:blur(6px);
  transition:
    opacity 0.4s var(--ease-build),
    transform 0.5s var(--ease-build),
    filter 0.35s var(--ease-build);
  transition-delay:var(--build-delay,0ms);
  will-change:opacity,transform,filter;
}
.dj-share-overlay [data-build].is-built{
  opacity:1;
  transform:translateY(0) scale(1);
  filter:blur(0);
}
.dj-share-overlay .fmodal[data-build-root]{
  opacity:0;
  transform:scale(0.92) translateY(20px);
  filter:blur(20px);
  transition:opacity 0.5s var(--ease-build),transform 0.7s var(--ease-build),filter 0.4s var(--ease-build);
}
.dj-share-overlay .fmodal[data-build-root].is-built{
  opacity:1;
  transform:scale(1) translateY(0);
  filter:blur(0);
}
.dj-share-overlay .fmodal-preview[data-build]{
  transform:translateX(-30px) scale(0.94);
}
.dj-share-overlay .fmodal-preview[data-build].is-built{
  transform:translateX(0) scale(1);
}

@media (prefers-reduced-motion: reduce){
  .dj-share-overlay [data-build],
  .dj-share-overlay .fmodal[data-build-root]{
    opacity:1!important;transform:none!important;filter:none!important;transition:none!important;
  }
}

/* ==========================================================================
   MODAL DE INFLUENCER — reusa o overlay scope (.dj-share-overlay)
   ========================================================================== */
.dj-influencer-overlay .infl-modal{
  display:flex;flex-direction:column;
  width:100%;max-width:760px;
  height:auto;max-height:92vh;
  grid-template-columns:none;
  background:linear-gradient(180deg,#0a1140 0%,#050926 100%);
  overflow:hidden;
}
.dj-influencer-overlay .infl-form{
  display:flex;flex-direction:column;
  height:100%;
  overflow:hidden;
}
.dj-influencer-overlay .infl-head{
  padding:32px 36px 14px;
  display:flex;flex-direction:column;gap:6px;
  border-bottom:1px solid rgba(255,255,255,0.04);
}
.dj-influencer-overlay .infl-eyebrow{
  display:inline-flex;align-items:center;gap:7px;
  font-size:0.66rem;font-weight:800;
  letter-spacing:0.16em;text-transform:uppercase;
  color:var(--gold);
  align-self:flex-start;
}
.dj-influencer-overlay .infl-eyebrow svg{width:14px;height:14px}
.dj-influencer-overlay .infl-title{
  font-family:var(--font-display);
  font-size:1.85rem;font-weight:900;
  line-height:1.04;letter-spacing:-0.01em;
  color:var(--text);margin:4px 0 0;
}
.dj-influencer-overlay .infl-title em{font-style:normal;color:var(--gold)}
.dj-influencer-overlay .infl-lead{
  font-size:0.86rem;color:var(--text-soft);
  line-height:1.5;max-width:560px;
  margin-top:2px;
}

/* Body com scroll interno se ultrapassar — modal externo trava em 92vh */
.dj-influencer-overlay .infl-body{
  flex:1;min-height:0;
  overflow-y:auto;
  padding:18px 36px 14px;
  display:flex;flex-direction:column;gap:20px;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.15) transparent;
}
.dj-influencer-overlay .infl-body::-webkit-scrollbar{width:6px}
.dj-influencer-overlay .infl-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.15);border-radius:999px}

.dj-influencer-overlay .infl-message{
  padding:10px 12px;
  border-radius:10px;
  font-size:0.82rem;
  font-weight:700;
  line-height:1.35;
}
.dj-influencer-overlay .infl-message--success{
  color:#d7ffe5;
  background:rgba(37,211,102,0.16);
  border:1px solid rgba(37,211,102,0.32);
}
.dj-influencer-overlay .infl-message--error{
  color:#ffd9de;
  background:rgba(255,51,68,0.14);
  border:1px solid rgba(255,51,68,0.3);
}

.dj-influencer-overlay .infl-section{display:flex;flex-direction:column;gap:10px}
.dj-influencer-overlay .infl-section-label{
  font-size:0.7rem;font-weight:800;
  letter-spacing:0.14em;text-transform:uppercase;
  color:var(--text-mute);
  display:flex;flex-direction:column;gap:3px;
}
.dj-influencer-overlay .infl-section-label small{
  font-size:0.7rem;font-weight:500;
  letter-spacing:0;text-transform:none;
  color:var(--text-soft);
}

/* Grid pessoal */
.dj-influencer-overlay .infl-grid{
  display:grid;
  grid-template-columns:1fr 1fr 0.4fr 1.2fr;
  gap:10px;
}
.dj-influencer-overlay .infl-field{display:flex;flex-direction:column;gap:5px}
.dj-influencer-overlay .infl-field--full{grid-column:1/-1}
.dj-influencer-overlay .infl-field--state{grid-column:auto}
.dj-influencer-overlay .infl-field--city{grid-column:auto}
.dj-influencer-overlay .infl-field > span{
  font-size:0.74rem;font-weight:600;
  color:var(--text-soft);
  display:inline-flex;align-items:center;gap:4px;
}
.dj-influencer-overlay .infl-field > span em{
  color:var(--gold);font-style:normal;font-weight:800;
}
.dj-influencer-overlay .infl-field input,
.dj-influencer-overlay .infl-field select{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:9px;
  padding:10px 12px;
  font-size:0.86rem;
  color:var(--text);
  font-family:var(--font-body);
  width:100%;
  transition:border-color 0.18s ease,background 0.18s ease;
}
.dj-influencer-overlay .infl-field input::placeholder{color:var(--text-mute)}
.dj-influencer-overlay .infl-field input:focus,
.dj-influencer-overlay .infl-field select:focus{
  outline:0;border-color:var(--gold);
  background:rgba(255,215,0,0.04);
}
.dj-influencer-overlay .infl-field select{
  appearance:none;-webkit-appearance:none;
  color-scheme:dark;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none'><path d='M1 1l5 5 5-5' stroke='%23ffd700' stroke-width='1.6' stroke-linecap='round'/></svg>");
  background-repeat:no-repeat;background-position:right 10px center;
  background-size:12px 8px;
  padding-right:28px;cursor:pointer;
}
.dj-influencer-overlay .infl-field select option{
  background:#070d32;
  color:#fff;
}
.dj-influencer-overlay .infl-field select:disabled{
  opacity:0.58;
  cursor:not-allowed;
}

/* Redes sociais — pílulas com ícone */
.dj-influencer-overlay .infl-socials{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:8px;
}
.dj-influencer-overlay .infl-social-field{
  display:flex;align-items:center;gap:0;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:10px;
  overflow:hidden;
  transition:border-color 0.18s ease,background 0.18s ease;
}
.dj-influencer-overlay .infl-social-field:focus-within{border-color:var(--gold);background:rgba(255,215,0,0.04)}
.dj-influencer-overlay .infl-social-icon{
  width:38px;height:38px;flex:0 0 38px;
  display:inline-flex;align-items:center;justify-content:center;
  border-right:1px solid var(--border);
}
.dj-influencer-overlay .infl-social-icon img{width:16px;height:16px;display:block;filter:brightness(0) invert(1);opacity:0.85}
.dj-influencer-overlay .infl-social-icon--text{font-weight:900;font-size:0.78rem;color:#fff;letter-spacing:-0.04em}
.dj-influencer-overlay .infl-social-field--ig .infl-social-icon{background:linear-gradient(135deg,#f09433,#dc2743,#bc1888)}
.dj-influencer-overlay .infl-social-field--tt .infl-social-icon{background:#000}
.dj-influencer-overlay .infl-social-field--x .infl-social-icon{background:#000}
.dj-influencer-overlay .infl-social-field--fb .infl-social-icon{background:#1877f2}
.dj-influencer-overlay .infl-social-field--yt .infl-social-icon{background:#ff0000}
.dj-influencer-overlay .infl-social-field--kw .infl-social-icon{background:linear-gradient(135deg,#ff5e00,#ff2200)}
.dj-influencer-overlay .infl-social-field input{
  flex:1;border:0;background:transparent;
  padding:9px 12px;font-size:0.84rem;
  color:var(--text);font-family:var(--font-body);
  outline:0;
}
.dj-influencer-overlay .infl-social-field input::placeholder{color:var(--text-mute);font-size:0.82rem}

/* Como contribuir */
.dj-influencer-overlay .infl-checks{display:flex;flex-direction:column;gap:6px}
.dj-influencer-overlay .infl-check{
  display:flex;align-items:flex-start;gap:11px;
  padding:11px 14px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:10px;
  cursor:pointer;
  transition:border-color 0.18s ease,background 0.18s ease;
}
.dj-influencer-overlay .infl-check:hover{border-color:rgba(255,215,0,0.4);background:rgba(255,215,0,0.03)}
.dj-influencer-overlay .infl-check input{position:absolute;opacity:0;pointer-events:none}
.dj-influencer-overlay .infl-check-mark{
  width:18px;height:18px;flex-shrink:0;margin-top:2px;
  border-radius:5px;
  border:1.5px solid var(--text-mute);
  background:transparent;
  display:inline-flex;align-items:center;justify-content:center;
  transition:all 0.18s ease;
}
.dj-influencer-overlay .infl-check-mark::after{
  content:'';width:9px;height:5px;
  border-left:2px solid var(--ink);
  border-bottom:2px solid var(--ink);
  transform:rotate(-45deg) translate(0,-1px);
  opacity:0;transition:opacity 0.18s ease;
}
.dj-influencer-overlay .infl-check input:checked + .infl-check-mark{
  background:var(--gold);border-color:var(--gold);
}
.dj-influencer-overlay .infl-check input:checked + .infl-check-mark::after{opacity:1}
.dj-influencer-overlay .infl-check-text{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}
.dj-influencer-overlay .infl-check-text strong{font-size:0.86rem;font-weight:700;color:var(--text)}
.dj-influencer-overlay .infl-check-text small{font-size:0.74rem;color:var(--text-soft);font-weight:500}
.dj-influencer-overlay .infl-check--terms .infl-check-text{font-size:0.78rem;color:var(--text-soft);line-height:1.4}
.dj-influencer-overlay .infl-check--terms a{color:var(--gold);text-decoration:underline}

/* Footer com submit */
.dj-influencer-overlay .infl-footer{
  padding:14px 36px 26px;
  border-top:1px solid rgba(255,255,255,0.04);
  background:rgba(0,0,0,0.18);
}
.dj-influencer-overlay .infl-submit{
  display:flex;align-items:center;gap:14px;
  width:100%;
  padding:13px 18px;border-radius:13px;
  background:linear-gradient(135deg,var(--whatsapp) 0%,var(--green-deep) 100%);
  color:#fff;font-weight:700;
  text-decoration:none;cursor:pointer;border:0;
  transition:transform 0.25s var(--ease-spring),box-shadow 0.25s ease;
  font-family:var(--font-body);text-align:left;
}
.dj-influencer-overlay .infl-submit:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(37,211,102,0.4)}
.dj-influencer-overlay .infl-submit-icon{
  width:36px;height:36px;border-radius:10px;
  background:rgba(255,255,255,0.18);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.dj-influencer-overlay .infl-submit-icon svg{width:20px;height:20px;color:#fff}
.dj-influencer-overlay .infl-submit-text{flex:1;line-height:1.2;display:flex;flex-direction:column;gap:1px}
.dj-influencer-overlay .infl-submit-text strong{font-size:0.95rem}
.dj-influencer-overlay .infl-submit-text small{font-size:0.7rem;opacity:0.85;font-weight:500}
.dj-influencer-overlay .infl-submit-arrow svg{width:18px;height:18px}

/* Mobile */
@media (max-width:680px){
  .dj-influencer-overlay .infl-head{padding:24px 22px 12px}
  .dj-influencer-overlay .infl-body{padding:16px 22px 12px;gap:16px}
  .dj-influencer-overlay .infl-footer{padding:14px 22px 22px}
  .dj-influencer-overlay .infl-title{font-size:1.5rem}
  .dj-influencer-overlay .infl-grid{grid-template-columns:1fr 1fr}
  .dj-influencer-overlay .infl-field--full,
  .dj-influencer-overlay .infl-field--city{grid-column:1/-1}
  .dj-influencer-overlay .infl-socials{grid-template-columns:1fr}
}
