/* =============================================================================
   Suta Market Plan Onboarding — onboarding.css v2.2 premium
   Todos os seletores prefixados com .sm- para isolamento total do tema.
   ============================================================================= */

/* ── Variáveis ─────────────────────────────────────────────────────────────── */
.sm-wrap {
  /* Paleta */
  --sm-navy:        #0f172a;
  --sm-navy-soft:   #1e293b;
  --sm-accent:      #e94560;
  --sm-accent-dark: #c73652;
  --sm-green:       #10b981;
  --sm-text:        #0f172a;
  --sm-text-soft:   #334155;
  --sm-muted:       #64748b;
  --sm-hint:        #94a3b8;
  --sm-border:      #e2e8f0;
  --sm-border-soft: #f1f5f9;
  --sm-bg:          #f8fafc;
  --sm-surface:     #ffffff;
  --sm-plan-color:  #e94560;

  /* Geometria */
  --sm-radius-xs:   6px;
  --sm-radius-sm:   10px;
  --sm-radius:      16px;
  --sm-radius-lg:   22px;

  /* Sombras */
  --sm-shadow-xs:   0 1px 2px rgba(15,23,42,.04);
  --sm-shadow-sm:   0 1px 4px rgba(15,23,42,.06),0 4px 12px rgba(15,23,42,.06);
  --sm-shadow-md:   0 2px 8px rgba(15,23,42,.06),0 8px 24px rgba(15,23,42,.08);
  --sm-shadow-lg:   0 4px 16px rgba(15,23,42,.07),0 16px 40px rgba(15,23,42,.10);
  --sm-shadow-btn:  0 4px 16px rgba(233,69,96,.32);
  --sm-shadow-btn-h:0 6px 24px rgba(233,69,96,.44);

  /* Tipografia */
  --sm-font: 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --sm-tr:   .16s cubic-bezier(.4,0,.2,1);

  font-family:var(--sm-font);
  color:var(--sm-text);
  max-width:820px;
  margin:0 auto;
  padding:0 0 56px;
  box-sizing:border-box;
}
.sm-wrap *,.sm-wrap *::before,.sm-wrap *::after { box-sizing:border-box; }

/* ── Plan Hero ──────────────────────────────────────────────────────────────── */
.sm-plan-hero {
  background:linear-gradient(145deg,var(--sm-navy) 0%,#1e2a4a 100%);
  border-radius:var(--sm-radius-lg);
  padding:36px 40px;
  margin-bottom:28px;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.sm-plan-hero::before {
  content:'';position:absolute;top:-64px;right:-48px;
  width:220px;height:220px;background:var(--sm-plan-color);
  border-radius:50%;opacity:.10;
}
.sm-plan-hero::after {
  content:'';position:absolute;bottom:-80px;left:-20px;
  width:260px;height:260px;background:var(--sm-plan-color);
  border-radius:50%;opacity:.06;
}
.sm-plan-hero__badge {
  display:flex;align-items:center;gap:18px;margin-bottom:22px;
  position:relative;z-index:1;
}
.sm-plan-hero__icon {
  font-size:44px;line-height:1;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.25));
}
.sm-plan-hero__label {
  font-size:10px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(255,255,255,.48);margin-bottom:5px;
}
.sm-plan-hero__name {
  font-size:30px;font-weight:800;color:#fff;letter-spacing:-.03em;line-height:1;
}
.sm-plan-hero__price {
  display:flex;align-items:baseline;gap:8px;margin-bottom:18px;
  position:relative;z-index:1;padding-left:62px;
}
.sm-plan-hero__amount {
  font-size:38px;font-weight:800;color:var(--sm-plan-color);letter-spacing:-.03em;
}
.sm-plan-hero__recur { font-size:13px;color:rgba(255,255,255,.44);font-weight:400; }
.sm-plan-hero__note {
  font-size:13px;color:rgba(255,255,255,.56);margin:0;line-height:1.55;
  position:relative;z-index:1;padding-left:62px;
}

/* ── Mensagens de feedback ─────────────────────────────────────────────────── */
#sm-form-messages { margin-bottom:18px; }
.sm-alert {
  display:flex;align-items:flex-start;gap:10px;
  padding:14px 18px;border-radius:var(--sm-radius-sm);
  font-size:14px;line-height:1.55;margin-bottom:8px;
  animation:sm-fadein .2s ease;
}
.sm-alert--error   { background:#fff5f5;border:1px solid #fecdd3;color:#9f1239; }
.sm-alert--success { background:#f0fdf9;border:1px solid #a7f3d0;color:#065f46; }
@keyframes sm-fadein {
  from{opacity:0;transform:translateY(-5px)}
  to  {opacity:1;transform:translateY(0)}
}

/* ── Cards ─────────────────────────────────────────────────────────────────── */
.sm-card {
  background:var(--sm-surface);
  border:1px solid var(--sm-border);
  border-radius:var(--sm-radius-lg);
  box-shadow:var(--sm-shadow-sm);
  margin-bottom:20px;
  overflow:hidden;
  transition:box-shadow var(--sm-tr),border-color var(--sm-tr);
}
.sm-card:focus-within {
  box-shadow:var(--sm-shadow-md);
  border-color:rgba(15,23,42,.12);
}
.sm-card__header {
  display:flex;align-items:center;gap:14px;
  padding:22px 28px;
  border-bottom:1px solid var(--sm-border-soft);
  background:var(--sm-bg);
}
.sm-card__icon-wrap {
  width:40px;height:40px;border-radius:12px;
  background:var(--sm-surface);border:1px solid var(--sm-border);
  display:flex;align-items:center;justify-content:center;
  box-shadow:var(--sm-shadow-xs);flex-shrink:0;font-size:20px;line-height:1;
}
.sm-card__title {
  font-size:16px;font-weight:700;color:var(--sm-navy);margin:0 0 2px;
  letter-spacing:-.02em;
}
.sm-card__subtitle {
  font-size:12px;color:var(--sm-muted);margin:0;font-weight:400;
}
.sm-card__step {
  margin-left:auto;font-size:11px;font-weight:600;color:var(--sm-muted);
  background:var(--sm-surface);border:1px solid var(--sm-border);
  border-radius:20px;padding:4px 12px;white-space:nowrap;flex-shrink:0;
  letter-spacing:.02em;
}
.sm-card__body { padding:28px; }
.sm-card--terms { background:var(--sm-bg); }

/* ── Grid ──────────────────────────────────────────────────────────────────── */
.sm-grid-2 {
  display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px;
}
.sm-grid-2:last-child { margin-bottom:0; }
@media(max-width:620px){ .sm-grid-2{grid-template-columns:1fr;gap:14px;} }

/* ── Fields ────────────────────────────────────────────────────────────────── */
.sm-field { display:flex;flex-direction:column;gap:6px; }
.sm-field:not(:last-child) { margin-bottom:18px; }

.sm-label {
  font-size:12px;font-weight:600;color:var(--sm-text-soft);
  letter-spacing:.02em;line-height:1.3;
}
.sm-req { color:var(--sm-accent);margin-left:2px; }

/* Input base */
.sm-input {
  width:100%;height:44px;padding:0 14px;
  font-size:14px;font-family:var(--sm-font);color:var(--sm-text);
  background:var(--sm-surface);
  border:1.5px solid var(--sm-border);
  border-radius:var(--sm-radius-sm);
  transition:border-color var(--sm-tr),box-shadow var(--sm-tr),background var(--sm-tr);
  appearance:none;-webkit-appearance:none;
}
.sm-input::placeholder { color:var(--sm-hint);font-weight:400; }
.sm-input:hover:not(:focus) { border-color:#cbd5e1; }
.sm-input:focus {
  outline:none;
  border-color:#6366f1;
  box-shadow:0 0 0 3px rgba(99,102,241,.12);
  background:var(--sm-surface);
}
/* Error: só visível após interação */
.sm-field.sm-has-error .sm-input {
  border-color:#f87171;
  box-shadow:0 0 0 3px rgba(248,113,113,.10);
}
.sm-field.sm-is-valid .sm-input { border-color:#34d399; }

/* Select drop arrow */
.sm-select {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2394a3b8' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;
  padding-right:38px;cursor:pointer;
}
.sm-textarea {
  height:auto;padding:12px 14px;resize:vertical;min-height:88px;line-height:1.6;
}
.sm-field-hint  {
  font-size:11px;color:var(--sm-hint);line-height:1.45;margin:0;
  letter-spacing:.005em;
}
.sm-field-error {
  font-size:11px;color:#e05252;font-weight:500;line-height:1.35;display:none;
  margin-top:1px;
}
.sm-field.sm-has-error .sm-field-error { display:block;animation:sm-fadein .15s ease; }

/* ── Subdomínio ────────────────────────────────────────────────────────────── */
.sm-subdomain-wrap {
  display:flex;border:1.5px solid var(--sm-border);
  border-radius:var(--sm-radius-sm);overflow:hidden;
  transition:border-color var(--sm-tr),box-shadow var(--sm-tr);
}
.sm-subdomain-wrap:focus-within {
  border-color:#6366f1;
  box-shadow:0 0 0 3px rgba(99,102,241,.12);
}
.sm-field.sm-has-error .sm-subdomain-wrap { border-color:#f87171; }
.sm-subdomain-wrap .sm-input {
  border:none!important;box-shadow:none!important;border-radius:0!important;
  flex:1;min-width:0;
}
.sm-subdomain-suffix {
  background:var(--sm-bg);padding:0 14px;font-size:13px;
  color:var(--sm-muted);border-left:1px solid var(--sm-border);
  white-space:nowrap;font-weight:500;flex-shrink:0;
  display:flex;align-items:center;
}

/* ── Telefone ──────────────────────────────────────────────────────────────── */
.sm-phone-wrap {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:6px;
  align-items:start;
}
.sm-phone-number{ min-width:0; }
.sm-phone-hint  { font-size:11px;color:var(--sm-hint);margin:3px 0 0;display:block;letter-spacing:.005em; }

/* ── Secção fiscal ─────────────────────────────────────────────────────────── */
.sm-section-divider {
  display:flex;align-items:center;gap:12px;
  margin:24px 0 18px;
}
.sm-section-divider::before,.sm-section-divider::after {
  content:'';flex:1;height:1px;background:var(--sm-border-soft);
}
.sm-section-label {
  font-size:10px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sm-hint);white-space:nowrap;
}
.sm-grid-fiscal {
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:16px;
  margin-bottom:16px;
  align-items:start;
}
.sm-tax-wrap { position:relative; }
.sm-tax-input { padding-right:100px; }
.sm-tax-badge {
  position:absolute;right:12px;top:50%;transform:translateY(-50%);
  font-size:10px;font-weight:600;letter-spacing:.03em;
  color:var(--sm-hint);
  background:var(--sm-bg);
  border:1px solid var(--sm-border);
  border-radius:var(--sm-radius-xs);
  padding:3px 7px;pointer-events:none;white-space:nowrap;
  transition:opacity var(--sm-tr);
}
.sm-field--half,.sm-field--tax-span { max-width:100%; }

/* ── Upload ────────────────────────────────────────────────────────────────── */
.sm-upload-grid { display:flex;flex-direction:column;gap:8px;margin-bottom:18px; }
.sm-upload-slot {
  display:flex;align-items:center;gap:14px;padding:12px 16px;
  border:1.5px solid var(--sm-border);border-radius:var(--sm-radius-sm);
  background:var(--sm-surface);
  transition:border-color var(--sm-tr),box-shadow var(--sm-tr);
}
.sm-upload-slot:hover {
  border-color:#c7d2fe;
  box-shadow:var(--sm-shadow-xs);
}
.sm-upload-slot__info { display:flex;align-items:center;gap:12px;flex:1;min-width:0; }
.sm-upload-slot__icon { font-size:18px;flex-shrink:0; }
.sm-upload-slot__info strong {
  display:block;font-size:13px;font-weight:600;color:var(--sm-navy);line-height:1.3;
}
.sm-upload-slot__info span {
  display:block;font-size:11px;color:var(--sm-muted);line-height:1.3;
}
.sm-upload-btn {
  flex-shrink:0;display:inline-flex;align-items:center;gap:6px;
  padding:7px 14px;
  background:var(--sm-surface);
  border:1.5px solid var(--sm-border);
  border-radius:var(--sm-radius-sm);
  font-family:var(--sm-font);font-size:12px;font-weight:600;
  color:var(--sm-text-soft);cursor:pointer;white-space:nowrap;
  transition:border-color var(--sm-tr),background var(--sm-tr),color var(--sm-tr);
}
.sm-upload-btn:hover {
  border-color:#6366f1;color:#6366f1;background:#f5f3ff;
}
.sm-file-input { display:none; }
.sm-upload-preview {
  font-size:12px;color:var(--sm-green);font-weight:500;
  max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.sm-upload-notice {
  display:flex;align-items:flex-start;gap:10px;padding:12px 14px;
  background:var(--sm-bg);border:1px solid var(--sm-border-soft);
  border-radius:var(--sm-radius-sm);font-size:12px;
  color:var(--sm-muted);line-height:1.55;
}

/* ── Termos ────────────────────────────────────────────────────────────────── */
.sm-terms-row { margin-bottom:20px; }
.sm-terms-label {
  display:flex;align-items:flex-start;gap:12px;cursor:pointer;
}
.sm-terms-check-wrap {
  position:relative;flex-shrink:0;padding-top:1px;
}
.sm-terms-check-wrap input[type="checkbox"] { position:absolute;opacity:0;width:0;height:0; }
.sm-terms-checkmark {
  display:block;width:20px;height:20px;
  border:1.5px solid var(--sm-border);border-radius:5px;
  background:var(--sm-surface);
  transition:border-color var(--sm-tr),background var(--sm-tr);
  position:relative;
}
.sm-terms-check-wrap input:checked ~ .sm-terms-checkmark {
  background:var(--sm-navy);border-color:var(--sm-navy);
}
.sm-terms-checkmark::after {
  content:'';position:absolute;top:3px;left:5px;
  width:6px;height:9px;border:1.5px solid #fff;
  border-top:none;border-left:none;transform:rotate(45deg);
  opacity:0;transition:opacity .12s ease;
}
.sm-terms-check-wrap input:checked ~ .sm-terms-checkmark::after { opacity:1; }
.sm-terms-text {
  font-size:13px;color:var(--sm-text-soft);line-height:1.65;
}
.sm-terms-text a {
  color:var(--sm-accent);text-decoration:underline;text-underline-offset:2px;
}
.sm-terms-text a:hover { text-decoration:none; }
.sm-terms-error {
  display:none;margin-top:6px;padding-left:32px;
  font-size:11px;color:#e05252;font-weight:500;
}
.sm-terms-row.sm-has-error .sm-terms-error { display:block;animation:sm-fadein .15s ease; }
.sm-terms-row.sm-has-error .sm-terms-checkmark { border-color:#f87171; }

/* ── Botão CTA ─────────────────────────────────────────────────────────────── */
.sm-submit-area { text-align:center;padding-top:6px; }
.sm-btn {
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  border:none;font-family:var(--sm-font);font-weight:700;
  cursor:pointer;text-decoration:none;position:relative;
  transition:background var(--sm-tr),transform .15s,box-shadow var(--sm-tr);
}
.sm-btn--primary {
  background:linear-gradient(135deg,#e94560 0%,#d63354 100%);
  color:#fff;
  border-radius:14px;
  box-shadow:var(--sm-shadow-btn);
}
.sm-btn--primary:hover:not(:disabled) {
  background:linear-gradient(135deg,#d63354 0%,#bf2944 100%);
  transform:translateY(-2px);
  box-shadow:var(--sm-shadow-btn-h);
}
.sm-btn--primary:active:not(:disabled) {
  transform:translateY(0);
  box-shadow:var(--sm-shadow-btn);
}
.sm-btn--primary:disabled {
  background:#cbd5e1;cursor:not-allowed;
  box-shadow:none;transform:none;
}
.sm-btn--large {
  padding:17px 40px;font-size:15px;
  width:100%;max-width:440px;
  letter-spacing:.01em;
}
.sm-btn__default-content,.sm-btn__loading-content {
  display:flex;align-items:center;gap:10px;
}
.sm-btn__lock  { font-size:15px;opacity:.8; }
.sm-btn__arrow { font-size:17px;transition:transform var(--sm-tr); }
.sm-btn:hover .sm-btn__arrow { transform:translateX(4px); }
.sm-btn__spinner {
  width:18px;height:18px;
  border:2px solid rgba(255,255,255,.28);border-top-color:#fff;
  border-radius:50%;animation:sm-spin .65s linear infinite;flex-shrink:0;
}
@keyframes sm-spin { to{transform:rotate(360deg)} }
.sm-submit-note {
  margin-top:14px;font-size:12px;color:var(--sm-hint);line-height:1.55;
  max-width:440px;margin-left:auto;margin-right:auto;
}

/* ── Success page ──────────────────────────────────────────────────────────── */
.sutamarket-success-page {
  max-width:520px;margin:40px auto;text-align:center;
  background:#fff;padding:48px 32px;border-radius:20px;
  box-shadow:0 4px 32px rgba(0,0,0,.09);
}
.sutamarket-success-icon { font-size:56px;margin-bottom:16px; }
.sutamarket-success-page h2 { color:#10b981;font-size:26px;margin-bottom:12px; }

/* ── Pricing buttons ───────────────────────────────────────────────────────── */
.sutamarket-pricing-buttons {
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:20px;margin:20px 0;
}
.sutamarket-pricing-card {
  background:#fff;border:1px solid #e2e8f0;border-radius:16px;
  padding:24px 20px;text-align:center;
  box-shadow:0 1px 4px rgba(15,23,42,.06),0 4px 16px rgba(15,23,42,.06);
}
.sutamarket-pricing-card .plan-name  { font-size:20px;font-weight:700;color:#0f172a;margin-bottom:8px; }
.sutamarket-pricing-card .plan-price { color:#e94560;font-size:16px;font-weight:600;margin-bottom:16px; }

/* ── Plan selector ─────────────────────────────────────────────────────────── */
.sutamarket-plan-selector { max-width:820px;margin:0 auto;padding:32px;text-align:center; }
.sutamarket-plans-grid {
  display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:16px;margin-top:20px;
}
.sutamarket-plan-option {
  display:flex;flex-direction:column;align-items:center;padding:20px;
  background:#fff;border:1.5px solid #e2e8f0;border-radius:16px;
  text-decoration:none;color:#0f172a;
  transition:border-color .16s,box-shadow .16s;
}
.sutamarket-plan-option:hover {
  border-color:#e94560;
  box-shadow:0 4px 24px rgba(0,0,0,.1);color:#e94560;
}
.sutamarket-plan-option strong { font-size:17px;margin-bottom:6px; }
.sutamarket-plan-option span   { font-size:13px;color:#64748b; }
.sutamarket-btn {
  display:inline-block;padding:13px 28px;border:none;border-radius:10px;
  font-size:15px;font-weight:700;cursor:pointer;text-decoration:none;
  transition:background .16s,transform .1s;
}
.sutamarket-btn-primary { background:#e94560;color:#fff; }
.sutamarket-btn-primary:hover { background:#c73652;transform:translateY(-1px); }

/* ── Mobile ────────────────────────────────────────────────────────────────── */
@media(max-width:620px){
  .sm-grid-fiscal        { grid-template-columns:1fr; }
  .sm-tax-badge          { display:none; }
  .sm-tax-input          { padding-right:14px; }
  .sm-phone-wrap         { grid-template-columns:130px 1fr; }
}
@media(max-width:520px){
  .sm-wrap               { padding:0 0 32px; }
  .sm-plan-hero          { padding:24px 22px;border-radius:var(--sm-radius); }
  .sm-plan-hero__price,
  .sm-plan-hero__note    { padding-left:0; }
  .sm-plan-hero__amount  { font-size:30px; }
  .sm-plan-hero__name    { font-size:24px; }
  .sm-card__body         { padding:18px; }
  .sm-card__header       { padding:16px 18px;gap:10px; }
  .sm-card               { border-radius:var(--sm-radius); }
  .sm-card__step         { display:none; }
  .sm-btn--large         { max-width:100%;padding:15px 24px; }
  .sm-grid-2             { margin-bottom:14px; }
}

/* ── Overrides de alta especificidade contra resets de temas ────────────────
   Necessário porque o TT3 / block editor injeta estilos globais de input/select
   após o CSS do plugin, quebrando os grids de telefone e fiscal.
   ─────────────────────────────────────────────────────────────────────────── */

/* Forçar grid no grupo de telefone com especificidade máxima */
.sm-wrap .sm-phone-wrap {
  display:grid !important;
  grid-template-columns:168px 1fr !important;
  gap:8px !important;
  align-items:start !important;
}

/* Inputs dentro do phone-wrap têm largura definida pela coluna do grid */
.sm-wrap .sm-phone-wrap .sm-input {
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

/* Select do indicativo: forçar largura contida */
.sm-wrap .sm-phone-code {
  width:100% !important;
  max-width:168px !important;
  min-width:0 !important;
}

/* Forçar grid fiscal País + NIF */
.sm-wrap .sm-grid-fiscal {
  display:grid !important;
  grid-template-columns:1fr 2fr !important;
  gap:16px !important;
  align-items:start !important;
}

/* Garantir que filhos do fiscal não sobem para 100% da largura */
.sm-wrap .sm-grid-fiscal > .sm-field {
  min-width:0 !important;
  max-width:100% !important;
}

/* Badge do campo fiscal */
.sm-wrap .sm-tax-badge {
  display:inline-block !important;
  position:absolute !important;
  right:12px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  pointer-events:none !important;
  z-index:1 !important;
}

/* sm-tax-input com padding direito para o badge */
.sm-wrap .sm-tax-input {
  padding-right:100px !important;
}

/* Icon-wrap do cabeçalho dos cards */
.sm-wrap .sm-card__icon-wrap {
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:40px !important;
  height:40px !important;
  flex-shrink:0 !important;
}

/* Mobile overrides com especificidade alta */
@media(max-width:620px){
  .sm-wrap .sm-phone-wrap {
    grid-template-columns:130px 1fr !important;
  }
  .sm-wrap .sm-grid-fiscal {
    grid-template-columns:1fr !important;
  }
  .sm-wrap .sm-tax-badge { display:none !important; }
  .sm-wrap .sm-tax-input { padding-right:14px !important; }
}

/* Section divider pseudo-elements with high specificity */
.sm-wrap .sm-section-divider {
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
}
.sm-wrap .sm-section-divider::before,
.sm-wrap .sm-section-divider::after {
  content:'' !important;
  flex:1 !important;
  height:1px !important;
  background:var(--sm-border-soft) !important;
  display:block !important;
}

/* ══════════════════════════════════════════════════════════════════════════

/* ══════════════════════════════════════════════════════════════════════════
   PHONE SELECT — dropdown com bandeiras CSS
   Prefixo .sm-phone-select em todos os seletores.
   Todos os valores críticos com !important para vencer resets de tema WP/TT3.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Wrapper do grupo telefone (grid: dropdown | input) ─────────────────── */
.sm-wrap .sm-phone-wrap {
  display:grid !important;
  grid-template-columns:auto 1fr !important;
  gap:6px !important;
  align-items:start !important;
}

/* ── Bandeiras CSS ──────────────────────────────────────────────────────── */
.sm-wrap .sm-flag {
  display:inline-block !important;
  width:24px !important;
  height:16px !important;
  flex:0 0 24px !important;
  border-radius:3px !important;
  box-shadow:0 0 0 1px rgba(15,23,42,.14) !important;
  overflow:hidden !important;
  position:relative !important;
  vertical-align:middle !important;
  flex-shrink:0 !important;
}

/* PT — verde (40%) + vermelho + faixa dourada simulada */
.sm-wrap .sm-flag-pt {
  background:linear-gradient(to right,#006600 40%,#FF0000 40%) !important;
}
.sm-wrap .sm-flag-pt::after {
  content:'' !important;position:absolute !important;
  left:28%;top:18%;width:22%;height:64%;
  background:#FEDF00;border-radius:2px;
}

/* BR — fundo verde + losango amarelo via clip-path */
.sm-wrap .sm-flag-br {
  background:#009C3B !important;
}
.sm-wrap .sm-flag-br::before {
  content:'' !important;position:absolute !important;
  left:50%;top:50%;transform:translate(-50%,-50%);
  width:16px;height:10px;
  background:#FEDF00;
  clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);
}
.sm-wrap .sm-flag-br::after {
  content:'' !important;position:absolute !important;
  left:50%;top:50%;transform:translate(-50%,-50%);
  width:7px;height:7px;
  background:#002776;
  border-radius:50%;
}

/* AO — vermelho (cima) + preto (baixo) */
.sm-wrap .sm-flag-ao {
  background:linear-gradient(to bottom,#CC0000 50%,#000000 50%) !important;
}

/* GB — Union Jack: azul + diagonais brancas + cruz vermelha */
.sm-wrap .sm-flag-gb {
  background:#012169 !important;
}
.sm-wrap .sm-flag-gb::before {
  content:'' !important;position:absolute !important;inset:0;
  background:
    linear-gradient(to bottom,transparent 42%,#FFFFFF 42%,#FFFFFF 58%,transparent 58%),
    linear-gradient(to right,transparent 42%,#FFFFFF 42%,#FFFFFF 58%,transparent 58%);
}
.sm-wrap .sm-flag-gb::after {
  content:'' !important;position:absolute !important;inset:0;
  background:
    linear-gradient(to bottom,transparent 43%,#C8102E 43%,#C8102E 57%,transparent 57%),
    linear-gradient(to right,transparent 43%,#C8102E 43%,#C8102E 57%,transparent 57%);
}

/* ES — rojo (25%) + amarillo (50%) + rojo (25%) */
.sm-wrap .sm-flag-es {
  background:linear-gradient(to bottom,
    #AA151B 0%,#AA151B 25%,
    #F1BF00 25%,#F1BF00 75%,
    #AA151B 75%) !important;
}

/* FR — tricolor vertical */
.sm-wrap .sm-flag-fr {
  background:linear-gradient(to right,
    #002395 0%,#002395 33.3%,
    #FFFFFF 33.3%,#FFFFFF 66.6%,
    #ED2939 66.6%) !important;
}

/* DE — preto + vermelho + ouro */
.sm-wrap .sm-flag-de {
  background:linear-gradient(to bottom,
    #000000 0%,#000000 33.3%,
    #DD0000 33.3%,#DD0000 66.6%,
    #FFCE00 66.6%) !important;
}

/* IT — verde + branco + vermelho */
.sm-wrap .sm-flag-it {
  background:linear-gradient(to right,
    #009246 0%,#009246 33.3%,
    #FFFFFF 33.3%,#FFFFFF 66.6%,
    #CE2B37 66.6%) !important;
}

/* US — listras vermelhas + brancas + cantão azul */
.sm-wrap .sm-flag-us {
  background:repeating-linear-gradient(
    to bottom,
    #B22234 0,#B22234 1.23px,
    #FFFFFF 1.23px,#FFFFFF 2.46px
  ) !important;
}
.sm-wrap .sm-flag-us::before {
  content:'' !important;position:absolute !important;
  left:0;top:0;width:40%;height:54%;
  background:#3C3B6E;
}

/* ── Contentor do dropdown ──────────────────────────────────────────────── */
.sm-wrap .sm-phone-select {
  position:relative !important;
  width:auto !important;
  flex-shrink:0 !important;
}

/* ── Botão (campo fechado) ──────────────────────────────────────────────── */
.sm-wrap .sm-phone-select__button {
  /* Reset completo contra tema WP */
  all:unset !important;
  box-sizing:border-box !important;

  display:inline-flex !important;
  align-items:center !important;
  gap:7px !important;
  height:44px !important;
  padding:0 12px 0 10px !important;
  background:#ffffff !important;
  border:1.5px solid var(--sm-border,#e2e8f0) !important;
  border-radius:10px !important;
  cursor:pointer !important;
  white-space:nowrap !important;
  font-family:var(--sm-font,-apple-system,sans-serif) !important;
  font-size:13px !important;
  font-weight:500 !important;
  color:var(--sm-text,#0f172a) !important;
  transition:border-color .16s,box-shadow .16s !important;
  min-width:88px !important;
  outline:none !important;
  -webkit-appearance:none !important;
  -moz-appearance:none !important;
  appearance:none !important;
}
.sm-wrap .sm-phone-select__button:hover {
  border-color:#cbd5e1 !important;
}
.sm-wrap .sm-phone-select__button:focus,
.sm-wrap .sm-phone-select__button[aria-expanded="true"] {
  border-color:#6366f1 !important;
  box-shadow:0 0 0 3px rgba(99,102,241,.12) !important;
}

.sm-wrap .sm-phone-select__dial {
  font-weight:700 !important;
  font-size:13px !important;
  color:var(--sm-text,#0f172a) !important;
  letter-spacing:.01em !important;
  line-height:1 !important;
}
.sm-wrap .sm-phone-select__country {
  font-size:12px !important;
  color:var(--sm-muted,#64748b) !important;
  font-weight:400 !important;
  line-height:1 !important;
}
.sm-wrap .sm-phone-select__chevron {
  font-size:11px !important;
  color:var(--sm-hint,#94a3b8) !important;
  margin-left:auto !important;
  transition:transform .16s !important;
  line-height:1 !important;
  display:inline-block !important;
}
.sm-wrap .sm-phone-select__button[aria-expanded="true"] .sm-phone-select__chevron {
  transform:rotate(180deg) !important;
}

/* ── Lista dropdown ─────────────────────────────────────────────────────── */
.sm-wrap .sm-phone-select__list {
  /* Reset OBRIGATÓRIO — vence ul/li do tema TT3 e block editor */
  all:unset !important;
  box-sizing:border-box !important;

  display:block !important;
  position:absolute !important;
  top:calc(100% + 6px) !important;
  left:0 !important;
  right:0 !important;
  z-index:9999 !important;
  min-width:210px !important;
  max-height:280px !important;
  overflow-y:auto !important;

  background:#ffffff !important;
  border:1.5px solid var(--sm-border,#e2e8f0) !important;
  border-radius:14px !important;
  box-shadow:0 16px 40px rgba(15,23,42,.15),0 4px 12px rgba(15,23,42,.08) !important;
  padding:6px !important;
  margin:0 !important;
  list-style:none !important;
  animation:sm-fadein .14s ease !important;
}

/* CRÍTICO — esconder quando tem o atributo hidden */
.sm-wrap .sm-phone-select__list[hidden] {
  display:none !important;
}

/* ── Cada opção da lista ────────────────────────────────────────────────── */
.sm-wrap .sm-phone-select__option {
  /* Reset contra li do tema */
  all:unset !important;
  box-sizing:border-box !important;

  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  padding:9px 12px !important;
  border-radius:10px !important;
  cursor:pointer !important;
  transition:background .12s !important;
  font-family:var(--sm-font,-apple-system,sans-serif) !important;
  font-size:13px !important;
  color:var(--sm-text,#0f172a) !important;
  outline:none !important;
  list-style:none !important;
  list-style-type:none !important;
  margin:0 !important;
}
.sm-wrap .sm-phone-select__option::marker {
  display:none !important;
  content:'' !important;
}
.sm-wrap .sm-phone-select__option:hover,
.sm-wrap .sm-phone-select__option:focus {
  background:#f3f6ff !important;
}
.sm-wrap .sm-phone-select__option[aria-selected="true"] {
  background:#f1f5ff !important;
  font-weight:600 !important;
}

.sm-wrap .sm-phone-select__option-dial {
  font-weight:700 !important;
  font-size:12px !important;
  color:var(--sm-text-soft,#334155) !important;
  min-width:34px !important;
  flex-shrink:0 !important;
  line-height:1 !important;
}
.sm-wrap .sm-phone-select__option-country {
  font-size:13px !important;
  color:var(--sm-muted,#64748b) !important;
  line-height:1 !important;
}

/* ── Estado de erro no campo telefone ──────────────────────────────────── */
.sm-wrap .sm-field.sm-has-error .sm-phone-select__button {
  border-color:#f87171 !important;
  box-shadow:0 0 0 3px rgba(248,113,113,.10) !important;
}

/* ── Mobile ─────────────────────────────────────────────────────────────── */
@media(max-width:620px){
  .sm-wrap .sm-phone-select__button {
    min-width:72px !important;
    padding:0 8px 0 8px !important;
    font-size:12px !important;
  }
  .sm-wrap .sm-phone-select__country {
    display:none !important; /* esconde nome em mobile, mantém bandeira + código */
  }
  .sm-wrap .sm-phone-select__list {
    min-width:190px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   COUNTRY SELECT — dropdown de país com bandeiras CSS
   Reutiliza a base visual do sm-phone-select.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Bandeira "OTHER" — globo minimalista em CSS ────────────────────────── */
.sm-wrap .sm-flag-other {
  background:radial-gradient(circle at 50% 40%, #e0eaf8 0%, #7ba7d4 55%, #3a6ea8 100%) !important;
  border-radius:50% !important;
  width:18px !important;
  height:18px !important;
  flex:0 0 18px !important;
}
.sm-wrap .sm-flag-other::before {
  content:'' !important;position:absolute !important;
  left:50%;top:50%;transform:translate(-50%,-50%);
  width:18px;height:1.5px;background:rgba(255,255,255,.55);
}
.sm-wrap .sm-flag-other::after {
  content:'' !important;position:absolute !important;
  left:50%;top:50%;transform:translate(-50%,-50%);
  width:1.5px;height:18px;background:rgba(255,255,255,.55);
}

/* ── Contentor ──────────────────────────────────────────────────────────── */
.sm-wrap .sm-country-select {
  position:relative !important;
  width:100% !important;
}

/* ── Botão — partilha base visual com sm-phone-select__button ───────────── */
.sm-wrap .sm-country-select__button {
  all:unset !important;
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  width:100% !important;
  height:44px !important;
  padding:0 12px 0 10px !important;
  background:#ffffff !important;
  border:1.5px solid var(--sm-border,#e2e8f0) !important;
  border-radius:10px !important;
  cursor:pointer !important;
  font-family:var(--sm-font,-apple-system,sans-serif) !important;
  font-size:14px !important;
  font-weight:400 !important;
  color:var(--sm-text,#0f172a) !important;
  transition:border-color .16s,box-shadow .16s !important;
  outline:none !important;
  -webkit-appearance:none !important;
  appearance:none !important;
}
.sm-wrap .sm-country-select__button:hover {
  border-color:#cbd5e1 !important;
}
.sm-wrap .sm-country-select__button:focus,
.sm-wrap .sm-country-select__button[aria-expanded="true"] {
  border-color:#6366f1 !important;
  box-shadow:0 0 0 3px rgba(99,102,241,.12) !important;
}

.sm-wrap .sm-country-select__label {
  flex:1 !important;
  text-align:left !important;
  font-size:14px !important;
  color:var(--sm-text,#0f172a) !important;
  line-height:1 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.sm-wrap .sm-country-select__chevron {
  font-size:11px !important;
  color:var(--sm-hint,#94a3b8) !important;
  margin-left:auto !important;
  flex-shrink:0 !important;
  transition:transform .16s !important;
  line-height:1 !important;
  display:inline-block !important;
}
.sm-wrap .sm-country-select__button[aria-expanded="true"] .sm-country-select__chevron {
  transform:rotate(180deg) !important;
}

/* ── Lista dropdown ─────────────────────────────────────────────────────── */
.sm-wrap .sm-country-select__list {
  all:unset !important;
  box-sizing:border-box !important;
  display:block !important;
  position:absolute !important;
  top:calc(100% + 6px) !important;
  left:0 !important;
  right:0 !important;
  z-index:9999 !important;
  min-width:180px !important;
  max-height:280px !important;
  overflow-y:auto !important;
  background:#ffffff !important;
  border:1.5px solid var(--sm-border,#e2e8f0) !important;
  border-radius:14px !important;
  box-shadow:0 16px 40px rgba(15,23,42,.15),0 4px 12px rgba(15,23,42,.08) !important;
  padding:6px !important;
  margin:0 !important;
  list-style:none !important;
  animation:sm-fadein .14s ease !important;
}
.sm-wrap .sm-country-select__list[hidden] {
  display:none !important;
}

/* ── Cada opção ─────────────────────────────────────────────────────────── */
.sm-wrap .sm-country-select__option {
  all:unset !important;
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  padding:9px 12px !important;
  border-radius:10px !important;
  cursor:pointer !important;
  transition:background .12s !important;
  font-family:var(--sm-font,-apple-system,sans-serif) !important;
  font-size:14px !important;
  color:var(--sm-text,#0f172a) !important;
  outline:none !important;
  list-style:none !important;
  list-style-type:none !important;
  margin:0 !important;
}
.sm-wrap .sm-country-select__option::marker {
  display:none !important;
  content:'' !important;
}
.sm-wrap .sm-country-select__option:hover,
.sm-wrap .sm-country-select__option:focus {
  background:#f3f6ff !important;
}
.sm-wrap .sm-country-select__option[aria-selected="true"] {
  background:#f1f5ff !important;
  font-weight:600 !important;
}

/* ── Estado de erro ─────────────────────────────────────────────────────── */
.sm-wrap .sm-field.sm-has-error .sm-country-select__button {
  border-color:#f87171 !important;
  box-shadow:0 0 0 3px rgba(248,113,113,.10) !important;
}

/* ── Grid fiscal — garantir que o dropdown ocupa a coluna completa ────────── */
.sm-wrap .sm-grid-fiscal > .sm-field > .sm-country-select {
  display:block !important;
}

/* ── Mobile ─────────────────────────────────────────────────────────────── */
@media(max-width:620px){
  .sm-wrap .sm-country-select__list { min-width:160px !important; }
}

/* ══════════════════════════════════════════════════════════════════════════
   BOTÃO CTA — azul da marca #0043FF
   Sobrescreve o gradiente vermelho/rosa de .sm-btn--primary.
   Seletores escopados dentro de .sm-wrap para isolamento completo.
   ══════════════════════════════════════════════════════════════════════════ */

/* Estado normal */
.sm-wrap .sm-btn.sm-btn--primary {
  background:#0043FF !important;
  border:1px solid #0043FF !important;
  color:#FFFFFF !important;
  box-shadow:0 14px 30px rgba(0,67,255,.22) !important;
}

/* Ícones, SVG e spans herdam cor branca */
.sm-wrap .sm-btn.sm-btn--primary *,
.sm-wrap .sm-btn.sm-btn--primary svg {
  color:inherit !important;
  fill:currentColor !important;
  stroke:currentColor !important;
}

/* Hover */
.sm-wrap .sm-btn.sm-btn--primary:hover:not(:disabled) {
  background:#0036CC !important;
  border-color:#0036CC !important;
  color:#FFFFFF !important;
  box-shadow:0 18px 38px rgba(0,67,255,.28) !important;
  transform:translateY(-2px) !important;
}

/* Active */
.sm-wrap .sm-btn.sm-btn--primary:active:not(:disabled) {
  background:#002EA8 !important;
  border-color:#002EA8 !important;
  transform:translateY(0) !important;
  box-shadow:0 8px 18px rgba(0,67,255,.20) !important;
}

/* Focus acessível */
.sm-wrap .sm-btn.sm-btn--primary:focus-visible {
  outline:none !important;
  box-shadow:
    0 0 0 4px rgba(0,67,255,.22),
    0 14px 30px rgba(0,67,255,.22) !important;
}

/* Disabled / loading — azul claro, texto continua branco e legível */
.sm-wrap .sm-btn.sm-btn--primary:disabled,
.sm-wrap .sm-btn.sm-btn--primary[aria-disabled="true"] {
  background:#6B8CFF !important;
  border-color:#6B8CFF !important;
  color:#FFFFFF !important;
  cursor:not-allowed !important;
  opacity:1 !important;
  box-shadow:none !important;
  transform:none !important;
}

/* ── Bloco de redes sociais — grid 2 colunas desktop, 1 coluna mobile ───── */
.sm-wrap .sm-social-grid {
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:14px 18px !important;
}
.sm-wrap .sm-social-field { margin-bottom:0 !important; }
.sm-wrap .sm-label--sm    { font-size:12px !important; font-weight:600 !important; }

@media(max-width:620px){
  .sm-wrap .sm-social-grid { grid-template-columns:1fr !important; }
}

/* ── Subseção "Contacto e suporte da loja" ───────────────────────────────── */
.sm-wrap .sm-support-section {
  margin-top:24px !important;
  padding-top:20px !important;
  border-top:1px solid var(--sm-border-soft,#f1f5f9) !important;
}
.sm-wrap .sm-support-section__title {
  font-size:12px !important;
  font-weight:700 !important;
  letter-spacing:.1em !important;
  text-transform:uppercase !important;
  color:var(--sm-hint,#94a3b8) !important;
  margin:0 0 4px !important;
}
.sm-wrap .sm-support-section__hint {
  font-size:12px !important;
  color:var(--sm-hint,#94a3b8) !important;
  margin:0 0 14px !important;
}
.sm-wrap .sm-support-grid {
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:14px 18px !important;
}
@media(max-width:620px){
  .sm-wrap .sm-support-grid { grid-template-columns:1fr !important; }
}

/* ── Preview de IVA no card do plano ────────────────────────────────────────
   Apenas estimativa visual — a Stripe Tax faz o cálculo real.
   ─────────────────────────────────────────────────────────────────────────── */
.sm-plan-tax-preview {
  margin-top:12px;
  padding:10px 14px;
  background:rgba(255,255,255,.12);
  border-radius:10px;
  border:1px solid rgba(255,255,255,.18);
}
.sm-plan-tax-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:12px;
  color:rgba(255,255,255,.75);
  line-height:1.6;
}
.sm-plan-tax-row__value { font-weight:600; color:rgba(255,255,255,.9); }

.sm-plan-tax-total {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:7px;
  padding-top:7px;
  border-top:1px solid rgba(255,255,255,.2);
  font-size:13px;
  color:#fff;
  font-weight:600;
}
.sm-plan-tax-total__label { font-weight:500; color:rgba(255,255,255,.85); }
.sm-plan-tax-total__value { font-size:15px; }

.sm-plan-tax-note {
  margin:8px 0 0;
  font-size:10px;
  line-height:1.5;
  color:rgba(255,255,255,.55);
  font-style:italic;
}

/* ── Card País fiscal (bloco prévio antes de Dados do cliente) ─────────────── */
.sm-card--fiscal-pre {
  border: 2px solid var(--sm-primary, #0043FF);
  background: linear-gradient(135deg, rgba(0,67,255,.03), rgba(0,67,255,.01));
}
.sm-card--fiscal-pre .sm-card__icon-wrap {
  background: var(--sm-primary, #0043FF);
  color: #fff;
}

.sm-fiscal-message {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 12px;
  padding: 12px 14px;
  background: rgba(0,67,255,.05);
  border-left: 3px solid var(--sm-primary, #0043FF);
  border-radius: 6px;
  font-size: 14px;
  line-height: 1.5;
  color: #1a1a1a;
}
.sm-fiscal-message__icon { flex-shrink: 0; font-size: 16px; }
.sm-fiscal-message__text { flex: 1; }

@media (max-width: 600px) {
  .sm-card--fiscal-pre { padding: 18px 16px; }
  .sm-fiscal-message { font-size: 13px; padding: 10px 12px; }
}

/* ── Fix dropdown clipping (País fiscal + Telefone) ─────────────────────────
   Causa raiz: .sm-card tem overflow:hidden (linha 121) o que cria um clipping
   context que corta a lista absoluta do dropdown, mesmo com z-index:9999.
   Solução: o card que contém o dropdown aberto liberta overflow temporariamente.
   ─────────────────────────────────────────────────────────────────────────── */

/* Card "País fiscal" sempre permite overflow visível porque o seu único
   conteúdo é o dropdown — não tem cantos arredondados a proteger */
.sm-wrap .sm-card--fiscal-pre,
.sm-wrap .sm-card--fiscal-pre .sm-card__body {
  overflow: visible !important;
}

/* Quando QUALQUER dropdown estiver aberto dentro de um card, o card e o body
   libertam overflow para a lista flutuar livremente */
.sm-wrap .sm-card:has(.sm-country-select__button[aria-expanded="true"]),
.sm-wrap .sm-card:has(.sm-phone-select__button[aria-expanded="true"]),
.sm-wrap .sm-card.sm-dropdown-open {
  overflow: visible !important;
}
.sm-wrap .sm-card:has(.sm-country-select__button[aria-expanded="true"]) .sm-card__body,
.sm-wrap .sm-card:has(.sm-phone-select__button[aria-expanded="true"]) .sm-card__body,
.sm-wrap .sm-card.sm-dropdown-open .sm-card__body {
  overflow: visible !important;
}

/* Fallback para browsers sem :has() — JS adiciona classe sm-dropdown-open
   no .sm-card pai do dropdown ao abrir, e remove ao fechar */
.sm-wrap .sm-form-shell.sm-dropdown-open {
  overflow: visible !important;
}

/* Garantir que o wrapper do dropdown tem z-index alto quando aberto */
.sm-wrap .sm-country-select:has(.sm-country-select__button[aria-expanded="true"]),
.sm-wrap .sm-phone-select:has(.sm-phone-select__button[aria-expanded="true"]) {
  z-index: 10000 !important;
}

/* ── Página /contratar-plano/ — Cards comerciais (4 colunas) ──────────────── */
.sm-pricing-wrap {
  max-width: 1280px;
  margin: 0 auto;
  padding: 40px 20px 60px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: #0f172a;
}
.sm-pricing-header {
  text-align: center;
  margin-bottom: 40px;
}
.sm-pricing-title {
  font-size: 36px;
  font-weight: 800;
  margin: 0 0 10px;
  color: #0f172a;
  letter-spacing: -0.02em;
}
.sm-pricing-subtitle {
  font-size: 16px;
  color: #64748b;
  margin: 0;
  line-height: 1.5;
}

.sm-pricing-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  align-items: stretch;
}

.sm-pricing-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1.5px solid #e2e8f0;
  border-radius: 16px;
  padding: 28px 24px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.sm-pricing-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.10);
  border-color: #cbd5e1;
}
.sm-pricing-card--highlighted {
  border-color: #0043FF;
  border-width: 2px;
  box-shadow: 0 12px 32px rgba(0, 67, 255, 0.15);
}
.sm-pricing-card__badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: #0043FF;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 5px 14px;
  border-radius: 999px;
  white-space: nowrap;
}

.sm-pricing-card__head { margin-bottom: 16px; }
.sm-pricing-card__name {
  font-size: 22px;
  font-weight: 800;
  margin: 0 0 4px;
  color: #0f172a;
  letter-spacing: -0.01em;
}
.sm-pricing-card__subtitle {
  font-size: 13px;
  color: #64748b;
  margin: 0;
  font-weight: 500;
}

.sm-pricing-card__price {
  margin: 12px 0 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e2e8f0;
}
.sm-pricing-card__amount {
  font-size: 32px;
  font-weight: 800;
  color: #0043FF;
  letter-spacing: -0.02em;
  line-height: 1;
}

.sm-pricing-card__meta {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
}
.sm-pricing-card__meta li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 7px 0;
  font-size: 13px;
  border-bottom: 1px dashed #e2e8f0;
}
.sm-pricing-card__meta li:last-child { border-bottom: 0; }
.sm-pricing-card__meta-key { color: #64748b; }
.sm-pricing-card__meta-val { color: #0f172a; font-weight: 600; }

.sm-pricing-card__ideal {
  font-size: 13px;
  color: #475569;
  line-height: 1.5;
  margin-bottom: 14px;
  padding: 10px 12px;
  background: #f8fafc;
  border-radius: 8px;
}

.sm-pricing-card__features {
  list-style: none;
  margin: 0 0 24px;
  padding: 0;
  flex-grow: 1;
}
.sm-pricing-card__features li {
  position: relative;
  padding: 6px 0 6px 22px;
  font-size: 13px;
  line-height: 1.5;
  color: #1e293b;
}
.sm-pricing-card__features li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 6px;
  color: #0043FF;
  font-weight: 700;
}

.sm-pricing-card__cta {
  display: block;
  text-align: center;
  text-decoration: none;
  background: #0043FF;
  color: #fff !important;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.05em;
  padding: 14px 20px;
  border-radius: 10px;
  margin-top: auto;
  transition: background 0.15s ease, transform 0.15s ease;
}
.sm-pricing-card__cta:hover {
  background: #0036CC;
  transform: translateY(-1px);
  color: #fff !important;
}
.sm-pricing-card__cta:active {
  transform: translateY(0);
}

.sm-pricing-footnote {
  text-align: center;
  margin-top: 36px;
  color: #64748b;
  font-size: 13px;
  line-height: 1.5;
}

/* Tablet: 2 colunas */
@media (max-width: 1024px) {
  .sm-pricing-grid { grid-template-columns: repeat(2, 1fr); }
}
/* Mobile: 1 coluna */
@media (max-width: 640px) {
  .sm-pricing-grid { grid-template-columns: 1fr; gap: 20px; }
  .sm-pricing-title { font-size: 28px; }
  .sm-pricing-card { padding: 24px 20px; }
  .sm-pricing-card__amount { font-size: 28px; }
}

/* ── Cards comerciais — bloco de redes sociais ────────────────────────────── */
.sm-pricing-card__features { flex-grow: 0 !important; } /* override (CTA ficará empurrado pelo bloco social) */

.sm-pricing-card__socials {
  margin: 4px 0 22px;
  padding-top: 14px;
  border-top: 1px dashed #e2e8f0;
  flex-grow: 1; /* empurra o CTA para o fim, mantendo cards alinhados */
}
.sm-pricing-card__social-title {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
  margin: 0 0 8px;
}
.sm-pricing-card__social-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.sm-pricing-card__social-pill {
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  color: #0043FF;
  background: rgba(0, 67, 255, 0.08);
  padding: 5px 11px;
  border-radius: 999px;
  line-height: 1.2;
  white-space: nowrap;
}
.sm-pricing-card__social-empty {
  font-size: 12px;
  color: #94a3b8;
  font-style: italic;
  margin: 0;
}

/* Highlighted card — pills mais saturadas */
.sm-pricing-card--highlighted .sm-pricing-card__social-pill {
  background: rgba(0, 67, 255, 0.14);
}

/* ── Botão final — span de valor controlável por JS ────────────────────────── */
.sm-btn__amount {
  font-weight: 700;
  margin: 0 4px;
  white-space: nowrap;
  letter-spacing: 0.01em;
}
.sm-btn__amount:empty {
  display: none;
}
@media (max-width: 480px) {
  .sm-btn__amount { font-size: 14px; }
}