/*
Theme Name: 8 Slices
Theme URI: https://8slices.net
Author: 8 Slices
Description: Block theme for 8 Slices — brands on free pizza boxes for local pizzerias. Bold Montserrat type, ink / mustard / red palette, fully editable with core blocks.
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: eight-slices
*/

/* ---------- Brand bar & stripe dividers ---------- */
.es-brand-bar {
	height: 8px;
	margin: 0 !important;
	background: linear-gradient(90deg,
		var(--wp--preset--color--ink) 0 25%,
		var(--wp--preset--color--mustard) 25% 50%,
		var(--wp--preset--color--green) 50% 75%,
		var(--wp--preset--color--red) 75% 100%);
}
.es-stripes {
	height: 20px;
	margin: 0 !important;
	background: repeating-linear-gradient(-45deg,
		var(--wp--preset--color--ink) 0 14px,
		var(--wp--preset--color--mustard) 14px 28px);
}

/* ---------- Accent rule above headings ---------- */
.es-accent-rule::before {
	content: "";
	display: block;
	width: 56px;
	height: 8px;
	margin-bottom: 28px;
	background: var(--wp--preset--color--red);
}
.es-accent-rule.es-accent-ink::before { background: var(--wp--preset--color--ink); margin-bottom: 20px; }

/* ---------- Header ---------- */
.es-site-header { border-bottom: 2px solid var(--wp--preset--color--ink); }
.es-site-header .es-logo img { width: 180px; height: 80px; object-fit: contain; }

/* ---------- Section spacing ---------- */
.es-hero    { padding-top: clamp(56px, 8vw, 88px) !important; padding-bottom: clamp(64px, 8vw, 96px) !important; }
.es-mission { padding-top: clamp(64px, 9vw, 104px) !important; padding-bottom: clamp(64px, 9vw, 104px) !important; }
.es-cta     { padding-top: clamp(64px, 8vw, 96px) !important; padding-bottom: clamp(64px, 8vw, 96px) !important; }

.es-hero .wp-block-columns,
.es-mission .wp-block-columns { gap: 64px; }

/* ---------- Typography helpers ---------- */
.es-display {
	font-weight: 900;
	text-transform: uppercase;
	line-height: 0.95;
	letter-spacing: -0.01em;
}
.es-hero-title { font-size: clamp(44px, 6.2vw, 88px); }
.es-mission-title { font-size: clamp(34px, 4.2vw, 56px); line-height: 1; }
.es-cta-title { font-size: clamp(40px, 5.6vw, 76px); max-width: 900px; margin-inline: auto; }

.es-lead { font-size: 19px; line-height: 31px; max-width: 540px; }

.es-eyebrow {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

/* Highlighted phrase inside a heading (use the Highlight format or <mark>) */
.es-mission mark,
mark.es-highlight {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--mustard);
	padding: 0 10px;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

/* ---------- Hero photo ---------- */
.es-hero-photo { max-width: 480px; margin-inline: auto; }
.es-hero-photo img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; display: block; }

/* ---------- Buttons ---------- */
.wp-block-button .wp-block-button__link { transition: background-color .15s ease, color .15s ease; }
.es-btn-lg .wp-block-button__link { min-height: 56px; padding: 0 30px; display: inline-flex; align-items: center; font-size: 16px; }
.es-btn-xl .wp-block-button__link { min-height: 60px; padding: 0 32px; display: inline-flex; align-items: center; font-size: 17px; }
.es-btn-sm .wp-block-button__link { min-height: 44px; padding: 0 20px; display: inline-flex; align-items: center; font-size: 13px; letter-spacing: 0.12em; }
.wp-block-button .wp-block-button__link.has-ink-background-color:hover { background-color: var(--wp--preset--color--red) !important; }
.wp-block-button .wp-block-button__link.has-red-background-color:hover { background-color: var(--wp--preset--color--ink) !important; }

/* ---------- Email links ---------- */
.es-header-email { font-size: 15px; font-weight: 700; letter-spacing: 0.04em; }
.es-header-email a { text-decoration: none; }
.es-header-email a:hover { text-decoration: underline; }
.es-cta-email { font-size: clamp(22px, 3vw, 32px); font-weight: 800; letter-spacing: 0.02em; }
.es-cta-email a { color: var(--wp--preset--color--white); text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 6px; }
.es-cta-email a:hover { color: var(--wp--preset--color--ink); }

/* ---------- Footer ---------- */
.es-site-footer .es-logo img { height: 72px; width: auto; max-width: 200px; object-fit: contain; }
.es-site-footer p { font-size: 14px; line-height: 22px; }

/* ---------- Small screens ---------- */
@media (max-width: 781px) {
	.es-hero .wp-block-columns,
	.es-mission .wp-block-columns { gap: 40px; }
}