/*
Theme Name: Barz
Theme URI: https://dessertbarz.com
Author: Dessert Barz
Description: A light block theme for Barz, small-batch gourmet dessert bars from Spanish Fork, Utah. Every page is built from regular blocks you can edit, ready-made sections live in the "Barz sections" pattern category, and the Order Form block saves every request under Order Requests and emails it to you.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
Version: 1.0.3
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: barz
Tags: block-patterns, full-site-editing, wide-blocks, custom-colors, custom-logo, editor-style, one-column
*/

/* ---------- Base ---------- */
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
:where(a) { text-decoration-color: var(--wp--preset--color--gold); text-decoration-thickness: 1px; text-underline-offset: 4px; }
:where(h1, h2) { text-wrap: balance; }
:where(p) { text-wrap: pretty; }
:where(a, button, input, select, textarea, summary):focus-visible { outline: 2px solid var(--wp--preset--color--gold); outline-offset: 2px; }
.wp-site-blocks > * + * { margin-block-start: 0; }
.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; }

/* Script accent: italicize a word in a heading to set it in Pinyon Script */
:where(h1, h2, h3) em { font-family: var(--wp--preset--font-family--pinyon-script); font-style: normal; font-weight: 400; font-size: 1.1em; letter-spacing: 0; line-height: 0.9; padding: 0 0.12em; color: var(--wp--preset--color--cocoa); }
.has-ink-background-color :where(h1, h2, h3) em,
.has-cocoa-background-color :where(h1, h2, h3) em { color: inherit; }

/* ---------- Header ---------- */
.wp-site-blocks > header.wp-block-template-part { position: sticky; top: 0; z-index: 30; }
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) { .admin-bar .wp-site-blocks > header.wp-block-template-part { top: 0; } }
.site-header { background-color: rgba(250, 237, 221, 0.93); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.site-header .wp-block-site-logo img { height: 34px; width: auto; }
.site-header .wp-block-navigation-item__content { color: #3A322A; text-decoration: none; padding: 6px 2px; }
.site-header .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--cocoa); }
.site-header .barz-header-cta .wp-block-button__link { padding: 12px 22px; font-size: 13px; letter-spacing: 0.14em; }
.site-header .barz-header-cta .wp-block-button__link:hover { background-color: var(--wp--preset--color--cocoa) !important; }
.wp-block-navigation__responsive-container.is-menu-open { padding: clamp(18px, 4vw, 54px); }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container { gap: 20px; font-size: 18px; }
@media (min-width: 600px) and (max-width: 960px) { .site-header .wp-block-navigation { font-size: 12px; letter-spacing: 0.1em; } }

/* ---------- Text styles ---------- */
.is-style-eyebrow { font-family: var(--wp--preset--font-family--jost); font-size: 12px; font-weight: 400; letter-spacing: 0.28em; line-height: 1.5; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.has-ink-background-color .is-style-eyebrow { color: #B9A78F; }
.is-style-note { font-size: 14px; font-style: italic; line-height: 1.55; color: var(--wp--preset--color--muted); }
.barz-lead { max-width: 46ch; line-height: 1.65; }
.barz-copy { max-width: 48ch; line-height: 1.7; }
.has-text-align-center.barz-lead, .has-text-align-center.barz-copy { margin-inline: auto; }
.has-ink-background-color .barz-copy { color: #EADCC9; }
.barz-price { font-family: var(--wp--preset--font-family--jost); font-size: 28px; font-weight: 300; line-height: 1; color: var(--wp--preset--color--cocoa); }

/* ---------- Buttons ---------- */
.wp-block-button.is-style-outline > .wp-block-button__link.wp-element-button { background-color: transparent; border: 1px solid var(--wp--preset--color--gold); color: var(--wp--preset--color--ink); padding: 15px 29px; }
.wp-block-button.is-style-outline > .wp-block-button__link.wp-element-button:hover { background-color: var(--wp--preset--color--ink); border-color: var(--wp--preset--color--ink); color: var(--wp--preset--color--cream); }
.has-ink-background-color .wp-block-button.is-style-outline > .wp-block-button__link.wp-element-button { color: var(--wp--preset--color--cream); }
.wp-block-button__link.has-cream-background-color:hover { background-color: var(--wp--preset--color--gold) !important; color: var(--wp--preset--color--ink) !important; }

/* ---------- Sections ---------- */
.is-style-barz-divided { border-top: 1px solid var(--wp--preset--color--line); border-bottom: 1px solid var(--wp--preset--color--line); }
.is-style-barz-divided > .wp-block-column > p { margin: 0; padding: 22px 4px; text-align: center; font-family: var(--wp--preset--font-family--jost); font-size: 13px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--wp--preset--color--cocoa); }
.is-style-barz-divided > .wp-block-column + .wp-block-column { border-left: 1px solid var(--wp--preset--color--line); }
@media (max-width: 781px) { .is-style-barz-divided > .wp-block-column + .wp-block-column { border-left: 0; border-top: 1px solid var(--wp--preset--color--line); } }

.is-style-barz-card { background-color: var(--wp--preset--color--white); border: 1px solid #E7D3BC; border-radius: 3px; padding: clamp(22px, 3vw, 40px); }
.wp-block-columns.is-style-barz-card { padding: clamp(18px, 2.4vw, 28px); }

.barz-flavor .wp-block-image { margin: 0; background-color: var(--wp--preset--color--sand); border-radius: 3px; }
.barz-flavor h3 { margin: 0; }
.barz-stack { display: grid; gap: clamp(14px, 2vw, 20px); }
.barz-stack > * { margin: 0 !important; }

.is-style-barz-steps { border-top: 1px solid var(--wp--preset--color--line); }
.is-style-barz-steps > * { margin: 0 !important; padding: 18px 2px; border-bottom: 1px solid var(--wp--preset--color--line); }
.barz-step p { margin: 0; line-height: 1.6; color: var(--wp--preset--color--body); }
.barz-step strong { font-family: var(--wp--preset--font-family--jost); font-weight: 500; color: var(--wp--preset--color--ink); }
.barz-step .barz-step__num { flex: none; font-family: var(--wp--preset--font-family--jost); font-size: 13px; letter-spacing: 0.16em; color: var(--wp--preset--color--gold); padding-top: 2px; }

.is-style-barz-links { border-top: 1px solid var(--wp--preset--color--line); }
.is-style-barz-links > p { margin: 0 !important; border-bottom: 1px solid var(--wp--preset--color--line); }
.is-style-barz-links a { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 20px 4px; color: var(--wp--preset--color--ink); text-decoration: none; font-family: var(--wp--preset--font-family--jost); font-size: 14px; letter-spacing: 0.12em; text-transform: uppercase; }
.is-style-barz-links a::after { content: "\2192"; color: var(--wp--preset--color--cocoa); }
.is-style-barz-links a:hover { color: var(--wp--preset--color--cocoa); }

.barz-reviews .wp-block-quote.barz-review { max-width: 860px; margin: clamp(22px, 3vw, 34px) auto 0; padding: clamp(28px, 4vw, 52px); background-color: var(--wp--preset--color--white); border: 1px solid #E7D3BC; border-radius: 3px; text-align: center; }
.wp-block-quote.barz-review p { margin: 0; font-size: clamp(24px, 3vw, 34px); line-height: 1.3; }
.wp-block-quote.barz-review p::before { content: "\201C"; }
.wp-block-quote.barz-review p::after { content: "\201D"; }
.wp-block-quote cite { display: block; margin-top: 22px; font-family: var(--wp--preset--font-family--jost); font-size: 12px; font-style: normal; letter-spacing: 0.18em; text-transform: uppercase; color: var(--wp--preset--color--muted); }

.barz-faq { max-width: 880px; border-top: 1px solid var(--wp--preset--color--line); }
.barz-faq-section > * { max-width: 880px; }
.wp-block-details { margin: 0; border-bottom: 1px solid var(--wp--preset--color--line); }
.wp-block-details summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 22px 2px; font-family: var(--wp--preset--font-family--jost); font-size: 19px; font-weight: 400; line-height: 1.4; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; content: "+" / ""; flex: none; font-size: 22px; line-height: 1; color: var(--wp--preset--color--cocoa); transition: transform 0.2s; }
.wp-block-details[open] summary::after { transform: rotate(45deg); }
.wp-block-details > :not(summary) { margin: 0; padding: 0 2px 24px; max-width: 62ch; line-height: 1.7; color: var(--wp--preset--color--body); }

.barz-gallery .wp-block-image, .barz-flavors .wp-block-image { margin: 0; }

/* ---------- Footer ---------- */
.site-footer a:not(.wp-element-button) { color: var(--wp--preset--color--cream); text-decoration: none; }
.site-footer a:not(.wp-element-button):hover { text-decoration: underline; }
.site-footer p { margin-bottom: 0; }
.site-footer .barz-footer-muted { color: #C4B49E; max-width: 30ch; }
.site-footer .barz-footer-bottom .is-style-eyebrow { letter-spacing: 0.14em; margin: 0; }
.site-footer .wp-block-image { margin: 0; }
@media (min-width: 782px) and (max-width: 1080px) {
	.site-footer .wp-block-columns { flex-wrap: wrap !important; row-gap: 36px; }
	.site-footer .wp-block-columns > .wp-block-column { flex-basis: calc(50% - 28px) !important; flex-grow: 0; }
}

/* ---------- Order form block ---------- */
.barz-order form { display: flex; flex-direction: column; gap: 18px; margin: 0; }
.barz-order label { display: flex; flex-direction: column; gap: 8px; font-family: var(--wp--preset--font-family--jost); font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: #6B5F53; }
.barz-order input:not([type="checkbox"]), .barz-order select, .barz-order textarea { width: 100%; padding: 14px; border: 1px solid var(--wp--preset--color--line); border-radius: 2px; background-color: var(--wp--preset--color--field); color: var(--wp--preset--color--ink); font-family: var(--wp--preset--font-family--karla); font-size: 16px; letter-spacing: 0; text-transform: none; line-height: 1.4; box-sizing: border-box; }
.barz-order select { padding-right: 36px; }
.barz-order textarea { min-height: 96px; resize: vertical; }
.barz-order input:focus, .barz-order select:focus, .barz-order textarea:focus { border-color: var(--wp--preset--color--gold); outline: 2px solid rgba(201, 168, 124, 0.45); outline-offset: 0; }
.barz-order .barz-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)); gap: 18px; }
.barz-order .barz-check { flex-direction: row; align-items: flex-start; gap: 11px; font-family: var(--wp--preset--font-family--karla); font-size: 15px; letter-spacing: 0; text-transform: none; line-height: 1.55; color: var(--wp--preset--color--body); }
.barz-order .barz-check input { width: 17px; height: 17px; margin-top: 3px; accent-color: var(--wp--preset--color--cocoa); }
.barz-order .barz-submit { margin-top: 4px; padding: 17px 24px; border: 0; border-radius: 2px; background-color: var(--wp--preset--color--ink); color: var(--wp--preset--color--cream); cursor: pointer; font-family: var(--wp--preset--font-family--jost); font-size: 13.5px; letter-spacing: 0.18em; text-transform: uppercase; }
.barz-order .barz-submit:hover { background-color: var(--wp--preset--color--cocoa); }
.barz-order .barz-fineprint { margin: 0; text-align: center; font-size: 13.5px; font-style: italic; color: var(--wp--preset--color--muted); }
.barz-order .barz-hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.barz-order .barz-alert { margin: 0 0 18px; padding: 14px 16px; border: 1px solid #D9A58B; border-radius: 2px; background-color: #FBEDE6; color: #6E2F14; font-size: 15px; }
.barz-order .barz-success { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 26px 0; }
.barz-order .barz-success h3 { margin: 0; font-size: 32px; font-weight: 300; }
.barz-order .barz-success p { margin: 0; color: var(--wp--preset--color--body); }
