/* Sam Gayton theme: small shared rules. Page designs are inline in /pages. */
.sg-page img { max-width: 100%; }
.sg-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.sg-notice { grid-column: 1 / -1; font-weight: 700; font-size: 20px; line-height: 1.5; padding: 20px 24px; border: 3px solid #2A1A33; border-radius: 16px; background: #FFD23F; color: #2A1A33; }
.sg-notice--error { background: #FFE1EC; }

/* plain fallback pages */
.sg-plain { margin: 0; font-family: 'DM Sans', system-ui, sans-serif; color: #2A1A33; background: #FFFFFF; }
.sg-plain-head { background: #2A1A33; padding: 20px 24px; }
.sg-plain-head a { color: #FFFFFF; font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 28px; text-decoration: none; }
.sg-plain-main { max-width: 760px; margin: 0 auto; padding: 64px 24px; font-size: 19px; line-height: 1.7; }
.sg-plain-main h1, .sg-plain-main h2 { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; line-height: 1.1; }
.sg-plain-main a { color: #FF2E88; }

/* ---------- phones and small tablets ---------- */
@media (max-width: 760px) {
	html:has(body.sg-page), body.sg-page { overflow-x: clip; }
	.sg-page section, .sg-page footer, .sg-page header > div { padding-left: 16px !important; padding-right: 16px !important; }
	.sg-page section { padding-top: 56px !important; padding-bottom: 56px !important; }
	.sg-page [style*="grid-template-columns"] { grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: none !important; }
	.sg-page [style*="grid-column"], .sg-page [style*="grid-row"] { grid-column: auto !important; grid-row: auto !important; }
	.sg-page [aria-hidden="true"][style*="width:4px"] { display: none !important; }
	.sg-page h1 { font-size: clamp(34px, 10.5vw, 56px) !important; line-height: 1.05 !important; text-shadow: none; }
	.sg-page h2 { font-size: clamp(28px, 8.5vw, 40px) !important; line-height: 1.1 !important; }
	.sg-page h3 { font-size: clamp(22px, 6.5vw, 30px) !important; }
	.sg-page nav { gap: 12px 18px !important; }
	.sg-page footer > div:first-child > p:first-child { font-size: 28px !important; }
	/* homepage headline: shrink the big mixed-font words and give lines room */
	.sg-home #top h1 { line-height: 1.4 !important; }
	.sg-home #top h1 > span[style*="font-size"] { font-size: 1.15em !important; }
	.sg-home #top h1 > span[style*="Kablammo"] { display: inline-block; margin-bottom: 6px; }
	.sg-home #top h1 > span[style*="vertical-align:middle"] { white-space: nowrap; zoom: 0.88; }
	/* About timeline: the year bar doesn't fit a phone, so hide it */
	.sg-about [style*="grid-row:2;position:relative;height:44px"] { display: none !important; }
}

/* games: no double-tap zoom while button-mashing */
.sg-game, .sg-game iframe { touch-action: manipulation; }
