/* ============================================================
   NewXmod — the digital-product notice

   The band under a licence product's copy (inc/product-digital-notice.php,
   template-parts/product-digital-notice.php). Its own sheet rather than a
   section in single-product-details.css, which is at its 500-line ceiling and
   which every product page pays for: this one is enqueued only where the band
   is actually printed.

   IT SPEAKS THE CARD'S LANGUAGE, NOT A WARNING'S. The specification card
   (single-product-details.css) is the page's other boxed block, and a licence
   is not a fault: the same surface, the same radius, the same border, with the
   accent stripe every WooCommerce notice on this page already carries. Red is
   kept for the messages that stop a purchase; this is information a buyer needs
   before he makes one.

   Full width because it is a page-level row of `div.product` — the same
   `grid-column: 1 / -1` the tab bar and the extras take. It is enqueued after
   single-product.css, so the grid placement below does not depend on the other
   sheet's load order.
   ============================================================ */

.single-product div.product > .nx-digital {
	grid-column: 1 / -1;
	margin-block-start: clamp(1.5rem, 3vw, 2.5rem);
	padding: clamp(1.25rem, 2.4vw, 1.9rem);
	border: 1px solid var(--border);
	border-inline-start: 3px solid var(--accent);
	border-radius: var(--radius);
	background: var(--surface);
	color: var(--text);
}

.single-product .nx-digital__title {
	margin: 0 0 0.75rem;
	color: var(--text-bright);
	font-size: clamp(1.1rem, 1.9vw, 1.35rem);
	font-weight: 800;
	line-height: 1.25;
}

/* The one sentence that has to be read even by a visitor who skims the rows
   below it, so it is set at body size rather than as a caption. */
.single-product .nx-digital__lead {
	margin: 0;
	max-width: 68ch;
	font-size: 1rem;
	line-height: 1.75;
}

/* Rows rather than paragraphs: a label and its answer, which is how a licence
   term is read out loud, and the shape the spec card beside the picture already
   taught the page. The divider sits on top of each row so the lead above them
   stays attached to the heading instead of becoming a fourth row. */
.single-product .nx-digital__list {
	display: grid;
	margin: 1.25rem 0 0;
	padding: 0;
	list-style: none;
}

.single-product .nx-digital__item {
	display: grid;
	grid-template-columns: minmax(8.5rem, 13rem) minmax(0, 1fr);
	gap: 0.3rem 1.5rem;
	padding-block: 0.85rem;
	border-block-start: 1px solid var(--border);
}

.single-product .nx-digital__label {
	color: var(--text-bright);
	font-weight: 700;
	line-height: 1.6;
}

/* Quieter than the label on purpose: the label is the term, this is the fine
   print that qualifies it, and the two must not compete at the same weight.
   The measure stops at 72 characters because the band is 1200px wide: without
   it the second column ran from one edge of the page to the other and the
   longest sentence became one 110-character line, which nobody reads. */
.single-product .nx-digital__text {
	max-width: 72ch;
	color: var(--text-dim);
	line-height: 1.7;
}

/* Phone and tablet: the band takes the same lead-in as the tab bar, the extras
   and the enquiry form around it (single-product.css sets 2.25rem for those
   three below 992px), and the label goes above its text — two columns at this
   width leave the label wrapping to three lines beside four words of answer. */
@media (max-width: 991px) {
	.single-product div.product > .nx-digital {
		margin-block-start: 2.25rem;
	}
}

@media (max-width: 700px) {
	.single-product .nx-digital__item {
		grid-template-columns: minmax(0, 1fr);
	}
}