mr Anderson

function processHtml(inputHtml) {
  // Создаешь временный DOM для парсинга HTML
  
  const parser = new DOMParser();
  const doc = parser.parseFromString(inputHtml, 'text/html');

  // Обрабатываешь span внутри p
  doc.querySelectorAll('p span[style]').forEach((span) => {
    const style = span.getAttribute('style');
    const fontSizeMatch = style.match(/font-size:\s*([\d.]+)pt/);
    const fontWeightMatch = style.match(/font-weight:\s*(\d+)/);
  // дописать остальные регулярки (font-style и т.д.)

    let newElement;

    if (fontSizeMatch) {
      const fontSize = parseFloat(fontSizeMatch[1]);
      
      if (fontSize >= 18) {
        newElement = document.createElement('h2');
      } else if (fontSize >= 16) {
        newElement = document.createElement('h3');
      }
    }

    if (!newElement && fontWeightMatch) {
      const fontWeight = parseInt(fontWeightMatch[1], 10);
   
      if (fontWeight >= 700) {
        newElement = document.createElement('strong');
      }
    }

    // Если замена нашлась, то создаешь новый элемент
    if (newElement) {
      newElement.textContent = span.textContent;
      span.replaceWith(newElement);
    }
  });

  // Удаляешь лишние стили из p

  doc.querySelectorAll('p').forEach((p) => {
    p.removeAttribute('style');
  });

   return doc.body.innerHTML; // возвращаешь обработанный html
}


const inputHtml = `
<p dir="ltr" style="line-height:1.2;margin-top:0pt;margin-bottom:0pt;">
<span style="font-size:18pt;font-family:Calibri,sans-serif;color:#000000;background-color:#ffffff;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
   Тут текст
</span>
</p>`;

const resultHtml = processHtml(inputHtml);
console.log(resultHtml);

const discounts = {
  "A2": {
    "Глянцевая": [
      { min: 1, discount: 1 }, // До 10 листов
      { min: 10, discount: 0.9 }, // От 10 листов
      { min: 100, discount: 0.85 }, // От 100 листов
    ],
    "Матовая": [
      { min: 1, discount: 1 }, // До 10 листов
      { min: 10, discount: 0.8 }, // От 10 листов
      { min: 100, discount: 0.7 }, // От 100 листов
    ],
  },
  "A3": {
    "Глянцевая": [
      { min: 1, discount: 1 },
      { min: 10, discount: 0.95 },
      { min: 100, discount: 0.9 },
    ],
    "Матовая": [
      { min: 1, discount: 1 },
      { min: 10, discount: 0.85 },
      { min: 100, discount: 0.75 },
    ],
  },
};

function getDiscount(format, type, amount) {
  const rules = discounts[format][type];
  let discount = 1;

  for (const rule of rules) {
    if (amount >= rule.min) {
      discount = rule.discount;
    }
  }

  return discount;
}

jQuery(function ($) {
  $("#calc .form-control").on("input change", function () {
    const format = $("#paper option:selected").text();
    const type = $("#paper-type option:selected").text();
    const pricePerSheet = Number($("#paper option:selected").val());
    const multiplier = Number($("#paper-type option:selected").val());
    const amount = Number($("#paper-amount").val());

    if (!amount || amount < 1) {
      $("#totalprice").text("0 руб.");
      return;
    }

    // Получение скидки
    const discount = getDiscount(format, type, amount);

    // Расчёт итоговой стоимости
    const total = amount * pricePerSheet * multiplier * discount;

    // Вывод результата
    $("#totalprice").text(`${total.toLocaleString("ru-RU")}`);
  });
});

<div id="calc">
  <label>Формат бумаги</label>
  <select class="form-control" id="paper">
    <option value="2">A2</option>
    <option value="1">A3</option>
  </select>

  <label>Тип бумаги</label>
  <select class="form-control" id="paper-type">
    <option value="1">Глянцевая</option>
    <option value="2">Матовая</option>
  </select>

  <label>Листов в упаковке</label>
  <input type="text" class="form-control" id="paper-amount" />

  <div>
    <span id="totalprice">0</span> руб.
  </div>
</div>

const style = document.createElement('style');
style.textContent = `
  dialog::backdrop {
    background: red;
  }
`;
document.head.appendChild(style);

document.querySelector('dialog').classList.add('custom');

dialog.custom::backdrop {
  background: red;
}