/* JWC Tech Sheet — screen + print styles. Designed to fill one US Letter page. */

:root {
	--ts-ink: #231f20;
	--ts-gray: #58595b;
	--ts-rule: #b9b9b9;
}

* { box-sizing: border-box; }

html, body {
	margin: 0;
	padding: 0;
	background: #ededed;
	font-family: 'EB Garamond', Garamond, 'Times New Roman', serif;
	color: var(--ts-ink);
}

/* ---- toolbar (screen only) ---- */
.ts-toolbar {
	max-width: 8.5in;
	margin: 0 auto;
	padding: 14px 4px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.ts-back {
	color: var(--ts-gray);
	text-decoration: none;
	font-size: 15px;
	letter-spacing: .05em;
}
.ts-print {
	background: var(--ts-ink);
	color: #fff;
	border: 0;
	padding: 10px 22px;
	font-family: inherit;
	font-size: 15px;
	letter-spacing: .12em;
	text-transform: uppercase;
	cursor: pointer;
}
.ts-print:hover { background: #000; }

/* ---- sheet ---- */
.ts-page {
	position: relative;
	width: 8.5in;
	min-height: 11in;
	margin: 0 auto 40px;
	background: #fff;
	box-shadow: 0 2px 18px rgba(0,0,0,.18);
	padding: .55in .55in 0;
	display: flex;
	flex-direction: column;
}

/* ---- brand header ---- */
.ts-brand { text-align: center; margin-bottom: .45in; }
.ts-brand-tagline {
	font-size: 11px;
	letter-spacing: .45em;
	text-transform: uppercase;
	color: var(--ts-gray);
	margin-bottom: 10px;
}
.ts-logo { width: 4.6in; max-width: 100%; height: auto; }

/* ---- two-column body ----
 * The bottle is absolutely positioned so it always lands on the first
 * page beside the notes, even if long notes overflow the sheet. */
.ts-body {
	position: relative;
	flex: 1 0 auto;
}
.ts-main { margin-right: 2.85in; }
.ts-bottle {
	position: absolute;
	top: .45in;
	right: 0;
	width: 2.55in;
	text-align: center;
}
.ts-bottle img { width: 100%; height: auto; max-height: 7.4in; object-fit: contain; }

/* ---- titles ---- */
.ts-title {
	font-size: 21px;
	font-weight: 600;
	letter-spacing: .28em;
	text-transform: uppercase;
	margin: 0 0 6px;
}
.ts-subtitle {
	font-size: 15px;
	font-weight: 500;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--ts-gray);
	margin: 0 0 10px;
}

/* ---- section headers + dotted rules ---- */
.ts-rule {
	border-top: 2px dotted var(--ts-rule);
	margin: 7px 0;
}
.ts-section {
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .28em;
	text-transform: uppercase;
	margin: 12px 0 2px;
}

/* ---- notes ---- */
.ts-notes {
	font-size: var(--ts-notes-size, 13.5px);
	line-height: 1.45;
	text-align: justify;
	color: var(--ts-ink);
}
.ts-notes p { margin: 0 0 10px; }
.ts-notes p:last-child { margin-bottom: 0; }

/* ---- technical details table ---- */
.ts-tech {
	width: 100%;
	border-collapse: collapse;
	margin-top: 2px;
}
.ts-tech th, .ts-tech td {
	border-bottom: 1px solid var(--ts-gray);
	padding: 7px 4px;
	font-size: 13.5px;
	vertical-align: top;
}
.ts-tech th {
	width: 38%;
	text-align: left;
	font-weight: 500;
	letter-spacing: .18em;
	text-transform: uppercase;
}
.ts-chem {
	display: flex;
	gap: .45in;
	border-bottom: 1px solid var(--ts-gray);
	padding: 8px 4px;
	font-size: 13.5px;
}
.ts-chem strong {
	font-weight: 500;
	letter-spacing: .14em;
	text-transform: uppercase;
}

/* ---- footer ---- */
.ts-footer { margin-top: auto; padding-top: .3in; }
.ts-hours {
	text-align: center;
	color: #c5c5c5;
	margin-bottom: .22in;
	font-size: 20px;
}
.ts-hours-script { font-style: italic; letter-spacing: .06em; }
.ts-hours-flourish { font-size: 16px; padding: 0 .25in; }
.ts-address-bar {
	background: var(--ts-ink);
	color: #fff;
	text-align: center;
	font-size: 11.5px;
	letter-spacing: .28em;
	text-transform: uppercase;
	padding: 12px 10px;
	margin: 0 -0.55in;     /* bleed to sheet edges */
	-webkit-print-color-adjust: exact;
	print-color-adjust: exact;
}
.ts-address-bar em { text-transform: none; }
.ts-site { margin-top: 6px; }

/* ---- print ---- */
@page {
	size: letter;
	margin: 0;
}
@media print {
	html, body { background: #fff; }
	.no-print { display: none !important; }
	.ts-page {
		width: 100%;
		/* hard one-page clamp: slightly under 11in so rounding never spills */
		min-height: 0;
		height: 10.94in;
		overflow: hidden;
		margin: 0;
		box-shadow: none;
		page-break-after: avoid;
	}
}

/* ---- small screens (sheet is fixed-width by design; allow scroll) ---- */
@media screen and (max-width: 8.7in) {
	.ts-toolbar { padding: 14px; }
}