/**
 * Bicycle product pages on mobile — fix the collapsed-desktop sandwich:
 * hero image / ~130px dead cream / gallery image / title. On a phone the
 * hero is redundant (the gallery leads with the same bike) and the
 * desktop-scale padding is pure gap. Uniform data only — no new fields.
 * Gated by body.rg-bike-product (see functions.php).
 */
/* Buy-area jump link ("More about the X ↓") is a mobile affordance only;
   regroup20.js moves it under the SPECIFICATIONS row like techspecs. */
.moreabout-container {
	display: none;
}

@media (max-width: 639px) {
	body.rg-bike-product .titlebanner {
		display: none;
	}
	body.rg-bike-product .mainproductinfo.padding_248_192_128 {
		padding-top: 20px;
	}

	body.rg-bike-product .moreabout-container {
		display: block;
		border-top: 1px solid #7a7977;
		padding-top: 16px;
		margin-bottom: 16px;
	}
	body.rg-bike-product .moreabout-container .sizelink {
		cursor: pointer;
		text-transform: uppercase;
		text-decoration: none;
	}

	/* "More about the X" — promote the heading to the display style used by
	   THE FINER DETAILS, set a lead paragraph, and trim desktop-scale padding.
	   The description's first chunk keeps the p.body class after the browser
	   splits the invalid nested markup; later paragraphs are bare <p>s. */
	body.rg-bike-product .full-description {
		scroll-margin-top: 120px;
		padding-bottom: 64px;
	}
	body.rg-bike-product .full-description .subtitle1 {
		/* base p.subtitle1 rule carries !important on font-family */
		font-family: "Graphik Condensed Web", sans-serif !important;
		font-weight: 700;
		text-transform: uppercase;
		font-size: 36px;
		line-height: 0.9;
		margin-bottom: 20px;
	}
	body.rg-bike-product .full-description .text p.body {
		font-size: 18px;
		line-height: 1.55;
	}
}