/**
 * MHM2-710 — Product Description typography (".prose").
 *
 * Site-wide reading style for the raw CMS HTML authored per product in the
 * Description tab. NO content changes: one `.prose` wrapper is added around the
 * description block in Magento_Catalog/templates/product/view/details.phtml, and
 * element-level descendant rules below style every h2/h3/h4/p/ul/ol/table/b/a
 * inside automatically. All rules are scoped under `.prose` so nothing leaks into
 * other CMS content. Values lifted from "Mediband Description Simple Style".
 */
/* full tab width (per request) — no reading-measure cap */
.prose{max-width:none;font-size:15px;line-height:1.7;color:#4c565f;font-family:Manrope,system-ui,sans-serif}

/* headings — h3/h4 get a hairline divider ABOVE (fixes "glued to text") */
.prose h2{margin:0 0 14px;font:800 24px/1.25 Manrope,system-ui,sans-serif;color:#16202b;letter-spacing:-.02em;text-wrap:pretty}
.prose h2:not(:first-child){margin-top:36px}
.prose h3,.prose h4{margin:30px 0 10px;font:800 17px/1.3 Manrope,system-ui,sans-serif;color:#16202b;letter-spacing:-.01em;padding-top:22px;border-top:1px solid #eee7dc}

/* paragraphs — lead paragraph slightly larger + darker */
.prose p{margin:0 0 14px}
.prose h2+p:first-of-type,.prose>p:first-child{font-size:16px;color:#3f4954}

/* inline */
.prose b,.prose strong{color:#16202b;font-weight:700}
.prose a{color:#c85a17;font-weight:600;text-decoration:none}
.prose a:hover{text-decoration:underline}

/* unordered list — green check badge per item */
.prose ul{list-style:none;margin:16px 0 18px;padding:0;display:flex;flex-direction:column;gap:9px}
.prose ul li{position:relative;padding-left:30px}
.prose ul li::before{content:"";position:absolute;left:0;top:2px;width:19px;height:19px;border-radius:50%;background:#e7f5ed url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%231f9d63' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") no-repeat center}
/* nested list — smaller muted items with an orange dot */
.prose ul ul{margin:9px 0 0;gap:6px}
.prose ul ul li{padding-left:20px;font-size:14px;color:#67707a}
.prose ul ul li::before{width:6px;height:6px;border-radius:50%;background:#ef9a5c;top:9px;left:4px}

/* ordered list — orange numbered badge via counter */
.prose ol{margin:14px 0 18px;padding-left:0;list-style:none;counter-reset:pr;display:flex;flex-direction:column;gap:9px}
.prose ol li{position:relative;padding-left:32px;counter-increment:pr}
.prose ol li::before{content:counter(pr);position:absolute;left:0;top:1px;width:21px;height:21px;border-radius:50%;background:#fbe7d6;color:#c85a17;font:800 11.5px Manrope,system-ui,sans-serif;display:flex;align-items:center;justify-content:center}

/* tables */
.prose table{border-collapse:collapse;margin:16px 0;font-size:14px}
.prose table td,.prose table th{border:1px solid #eee7dc;padding:9px 14px;text-align:left}
.prose table th{background:#fbf9f6;color:#16202b;font-weight:700}

/* optional helper for "Label: value" spec chips (needs a content class; enhancement only) */
.prose .spec-line{display:inline-flex;align-items:center;gap:8px;background:#fbf9f6;border:1px solid #eee7dc;border-radius:9px;padding:7px 13px;margin:2px 8px 2px 0;font-size:13.5px}
.prose .spec-line b{font-weight:700}

@media(max-width:640px){
  .prose{font-size:14.5px}
  .prose h2{font-size:21px}
}