/* Home, information pages (Customer Service, Privacy Policy, ...) and the 404
   page (body.store-cms): their text is admin-edited CMS content, so this styles
   plain HTML elements inside it in the website's article type. Page margins and
   the page title come from store-common.css. */

body.store-cms .columns { display: block; }
body.store-cms .columns .column.main { width: 100%; float: none; padding: 0; }
body.store-cms .page-main .page-title-wrapper { margin: 36px 0 26px; }

/* Readable measure for article pages; the home page keeps the full width for its grid */
body.store-cms:not(.store-home) .column.main { max-width: 52em; }

body.store-cms #maincontent :is(h2, h3, h4) {
	font-family: var(--gm-font-display); font-weight: 700; letter-spacing: -0.02em; color: var(--gm-ink); font-style: normal;
}
body.store-cms #maincontent h2 { font-size: 28px; line-height: 1.15; margin: 36px 0 14px; }
body.store-cms #maincontent h3 { font-size: 20px; line-height: 1.25; margin: 28px 0 10px; }
body.store-cms #maincontent h4 { font-size: 17px; margin: 22px 0 8px; }
body.store-cms #maincontent :is(p, li, dd, td) { font-family: var(--gm-font-body); font-size: 17px; line-height: 1.65; color: var(--gm-body); }
body.store-cms #maincontent :is(ul, ol) { padding-left: 1.3em; margin: 0 0 16px; }
body.store-cms #maincontent li { margin: 0 0 6px; }
body.store-cms #maincontent table { border-collapse: collapse; margin: 0 0 20px; }
body.store-cms #maincontent :is(th, td) { padding: 10px 12px; border-bottom: 1px solid var(--gm-border); text-align: left; }
body.store-cms #maincontent th { font-family: var(--gm-font-mono); font-size: 11px; font-weight: 400; letter-spacing: 0.13em; text-transform: uppercase; color: var(--gm-muted); }
body.store-cms #maincontent img { max-width: 100%; height: auto; }

/* Home: the content's own "Welcome to ..." heading is the page title there */
body.store-home #maincontent .column.main > :is(h1, h2):first-child,
body.store-home #maincontent .column.main h2:first-of-type {
	margin: 36px 0 22px; font-size: clamp(34px, 3.6vw, 50px); letter-spacing: -0.028em; line-height: 1.05;
}
body.store-home #maincontent .column.main > p img,
body.store-home #maincontent .column.main a > img { border-radius: 14px; }
body.store-home .block.widget { margin-top: 36px; }

/* 404: Magento's "Whoops" content */
body.store-cms #maincontent dl dt { font-family: var(--gm-font-body); font-weight: 600; color: var(--gm-ink); margin: 16px 0 6px; }

/* Customer Service and 404 render their title as an h1 outside .page-title-wrapper,
   so store-common's title rule misses it (it kept the old italic 36px navy). */
body.store-cms #maincontent h1,
body.store-cms #maincontent h1 span {
	margin: 36px 0 22px; font-family: var(--gm-font-display); font-style: normal;
	font-size: clamp(34px, 3.6vw, 50px); font-weight: 700; letter-spacing: -0.028em; line-height: 1.05; color: var(--gm-ink);
}
body.store-cms #maincontent h1 span { margin: 0; }
/* Links in running text are underlined, in lists as in paragraphs (list links had none) */
body.store-cms #maincontent :is(p, li, dd, td) a:not([class*="action"]) { text-decoration: underline; text-underline-offset: 2px; }
body.store-cms #maincontent .page-title-wrapper h1 { margin: 0; } /* the wrapper already spaces it */
