/*
Theme Name: SAINT BigBlocks Next
Description: cnhumicacid.com redesign (staging preview only until approved): SAINT brand palette and font, new header and footer, homepage and product page layouts. Child theme of BigBlocks.
Author: SAINT HUMIC
Template: bigblocks
Version: 0.2.2
Requires at least: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: saint-bigblocks-next
*/

/* Brand font (self-hosted, Latin subset, SIL Open Font License) */
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 400 800; font-display: optional; src: url("assets/fonts/PlusJakartaSans-latin-normal.woff2") format("woff2"); }
@font-face { font-family: "Plus Jakarta Sans"; font-style: italic; font-weight: 400 800; font-display: optional; src: url("assets/fonts/PlusJakartaSans-latin-italic.woff2") format("woff2"); }

:root { --saint-brown: #2B2118; --saint-green: #2F6B1F; --saint-green-dark: #1F4A14; --saint-cream: #FBFAF6; --saint-sand: #F4F1EA; --saint-line: #E7E1D6; --saint-text: #4A4038; }
body { color: var(--saint-text); }
h1, h2, h3, h4, h5, h6 { color: var(--saint-brown); letter-spacing: -0.01em; }
a { color: var(--saint-green); }
a:hover { color: var(--saint-green-dark); }
.wp-element-button, .wp-block-button__link { border-radius: 6px; font-weight: 600; }
.is-style-outline > .wp-block-button__link { border: 2px solid currentColor; }

/* Top bar */
.saint-topbar { font-size: 14px; }
.saint-topbar a { color: #F4F1EA; text-decoration: none; }
.saint-topbar a:hover { color: #FFFFFF; text-decoration: underline; }

/* Main header */
.saint-mainheader { box-shadow: 0 1px 0 var(--saint-line); position: relative; z-index: 20; }
.saint-mainheader .wp-block-site-logo img { width: 250px !important; height: auto; }
.saint-mainheader .wp-block-navigation { font-size: 14px; font-weight: 600; letter-spacing: 0.02em; }
.saint-mainheader .wp-block-navigation a { color: var(--saint-brown); }
.saint-mainheader .wp-block-navigation a:hover { color: var(--saint-green); }
.saint-mainheader .wp-block-navigation__container { column-gap: 22px; }
.saint-mainheader .wp-block-navigation-item__content { white-space: nowrap; }
.saint-mainheader .wp-block-navigation__submenu-container { border: 1px solid var(--saint-line) !important; border-radius: 6px; padding: 6px 0; font-weight: 500; }
.saint-quote-btn .wp-block-button__link { white-space: nowrap; padding: 11px 20px; }
@media (min-width: 1100px) { .saint-mainheader .wp-block-navigation__container { flex-wrap: nowrap; } }

/* Cover text stays light */
.wp-block-cover :where(h1, h2, h3, h4, h5, h6, p):not(.has-text-color) { color: #FFFFFF; }

/* Home */
.wp-block-cover:has(.saint-hero-inner) > .wp-block-cover__inner-container { width: 100% !important; max-width: 1240px !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; }
.saint-hero-inner { width: 100%; padding-left: 0 !important; padding-right: 0 !important; }
.saint-eyebrow { text-transform: uppercase; letter-spacing: 0.12em; font-size: 13px !important; font-weight: 700; }
.saint-card { background: #FFFFFF; border: 1px solid var(--saint-line); border-radius: 10px; transition: box-shadow .15s ease, transform .15s ease; height: 100%; }
.saint-card:hover { box-shadow: 0 8px 24px rgba(43, 33, 24, .08); transform: translateY(-2px); }
.saint-card h3 a { color: var(--saint-brown); text-decoration: none; }
.saint-card h3 a::after { content: " \2192"; color: var(--saint-green); }
.saint-tag { display: inline-block; background: var(--saint-sand); color: var(--saint-green-dark) !important; border-radius: 99px; padding: 2px 10px; font-size: 12px !important; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; margin: 0 !important; }
.saint-step-num { display: inline-flex; width: 36px; height: 36px; border-radius: 50%; align-items: center; justify-content: center; background: var(--saint-green); color: #fff !important; font-weight: 700; }
.saint-posts .wp-block-post-featured-image img { border-radius: 8px; aspect-ratio: 16/10; object-fit: cover; }
.saint-posts .wp-block-post-title a { color: var(--saint-brown); text-decoration: none; }
.saint-posts .wp-block-post-title a:hover { color: var(--saint-green); }

/* Photos */
.saint-photo { background: #FFFFFF; border: 1px solid var(--saint-line); border-radius: 12px; overflow: hidden; aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; }
.saint-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.saint-photo--empty { background: #FFFFFF; flex-direction: column; gap: 12px; color: #8A7F74; font-size: 14px; display: flex; align-items: center; justify-content: center; }
.saint-photo--empty img { width: 96px; height: 96px; object-fit: contain; opacity: .9; }
.saint-img { display: block; width: 100%; height: auto; }

/* Home sections */
.saint-fact { border-top: 3px solid var(--saint-green); background: #FFFFFF; }
.saint-fact h3 { margin: 0; }
.saint-card { overflow: hidden; }
.saint-card .saint-img { aspect-ratio: 4 / 3; object-fit: cover; border-bottom: 1px solid var(--saint-line); }
.saint-card-ph { aspect-ratio: 4 / 3; background: var(--saint-sand); border-bottom: 1px solid var(--saint-line); display: flex; align-items: center; justify-content: center; }
.saint-card-ph span { font-size: 13px; color: #8A7F74; }
.saint-app { background: var(--saint-cream); border: 1px solid var(--saint-line); border-radius: 10px; height: 100%; }
.saint-app h3 a { color: var(--saint-brown); text-decoration: none; }
.saint-app h3 a::after { content: " \2192"; color: var(--saint-green); }
.saint-pack .saint-img { border-radius: 10px; aspect-ratio: 4 / 3; object-fit: cover; }
.saint-pack p { color: var(--saint-text); font-weight: 600; margin: 0; }

/* Fixed column counts for home grids */
.is-layout-grid:has(> .saint-fact) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.is-layout-grid:has(> .saint-app) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.is-layout-grid:has(> .saint-pack) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.is-layout-grid:has(> .saint-card) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
@media (max-width: 1024px) {
	.is-layout-grid:has(> .saint-fact), .is-layout-grid:has(> .saint-pack), .is-layout-grid:has(> .saint-card) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 600px) {
	.is-layout-grid:has(> .saint-app) { grid-template-columns: 1fr !important; }
	.is-layout-grid:has(> .saint-card) { gap: 12px !important; }
	.saint-card-body { padding: 14px !important; }
	.saint-card-body p:not(.saint-tag) { display: none; }
	.saint-card-body h3 { font-size: 1rem !important; }
	.saint-fact { padding: 16px !important; }
	.saint-fact p { font-size: 14px !important; }
}

/* Product page */
.saint-facts { list-style: none; padding: 0; margin: 20px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.saint-facts li { background: #FFFFFF; border: 1px solid var(--saint-line); border-radius: 10px; padding: 14px 16px; }
.saint-facts strong { display: block; color: var(--saint-green-dark); font-size: clamp(1.15rem, 2vw, 1.5rem); font-weight: 800; line-height: 1.2; }
.saint-facts span { display: block; font-size: 13px; color: var(--saint-text); margin-top: 4px; }
.saint-facts-unavailable { margin: 20px 0 0; padding: 14px 16px; background: #FFFFFF; border: 1px solid var(--saint-line); border-left: 4px solid var(--saint-brown); border-radius: 10px; font-size: 16px; }
.saint-facts-note { font-size: 13px; color: #8A7F74; margin-top: 8px; }
.saint-product-hero .wp-block-post-title { margin: 0; }
.saint-crumbs, .saint-crumbs a { color: #6B5E52; text-decoration: none; }
.saint-crumbs a:hover { color: var(--saint-green); text-decoration: underline; }
.saint-product-body .wp-block-post-content h2 { font-size: clamp(1.25rem, 2vw, 1.6rem); font-weight: 700; padding-bottom: 8px; border-bottom: 2px solid var(--saint-line); margin-top: 2.2em; }
.saint-product-body .wp-block-post-content h2:first-child { margin-top: 0; }
.saint-product-body .wp-block-post-content > * { max-width: 100%; }
.saint-side { position: sticky; top: 24px; }
.saint-side-box { background: #FFFFFF; border: 1px solid var(--saint-line); border-radius: 10px; }
.saint-side-box ul { list-style: none; padding: 0; margin: 0; }
.saint-side-box li { border-top: 1px solid var(--saint-line); }
.saint-side-box li:first-child { border-top: 0; }
.saint-side-box li a { display: block; padding: 8px 0; font-size: 15px; color: var(--saint-brown); text-decoration: none; font-weight: 500; }
.saint-side-box li a:hover { color: var(--saint-green); }
.saint-side-box li a[aria-current="page"] { color: var(--saint-green); font-weight: 700; }

/* Tables inside page content (spec tables) */
.wp-block-post-content table { border-collapse: collapse; width: 100%; background: #FFFFFF; font-size: 15px; }
.wp-block-post-content table td, .wp-block-post-content table th { border: 1px solid var(--saint-line); padding: 10px 14px; color: #3E352C; }
.wp-block-post-content table tbody tr:nth-child(even) td { background: var(--saint-cream); }
.wp-block-post-content table thead th, .wp-block-post-content table thead td { background: var(--saint-brown); color: #FFFFFF; font-weight: 600; border-color: var(--saint-brown); }
.wp-block-post-content table:not(:has(thead)) tr:first-child td { background: var(--saint-brown); color: #FFFFFF; font-weight: 600; }
.wp-block-post-content figure.wp-block-table { overflow-x: auto; margin-left: 0; margin-right: 0; }

/* Footer */
.saint-footer, .saint-footer p, .saint-footer li { color: #D9CFC2; }
.saint-footer a { color: #EDE6DC; text-decoration: none; }
.saint-footer a:hover { color: #FFFFFF; text-decoration: underline; }
.saint-footer h2, .saint-footer h3 { color: #FFFFFF; }
.saint-footer ul { list-style: none; padding-left: 0; }
.saint-footer li { margin: 0 0 6px; }

/* Phones */
@media (max-width: 782px) {
	.saint-facts { grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
	.saint-facts li { padding: 10px; }
	.wp-block-post-content table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.wp-block-post-content table td, .wp-block-post-content table th { min-width: 110px; }
	.saint-topbar .saint-topbar-place { display: none; }
	.saint-mainheader .wp-block-site-logo img { width: 190px !important; }
	.saint-side { position: static; }
	.saint-hide-mobile { display: none !important; }
}

/* Inquiry form (WPForms) in brand colours */
.wpforms-container .wpforms-form button.wpforms-submit,
.wpforms-container .wpforms-form button.wpforms-submit:focus { background-color: #2F6B1F; border-color: #2F6B1F; color: #fff; border-radius: 6px; }
.wpforms-container .wpforms-form button.wpforms-submit:hover { background-color: #1F4A14; border-color: #1F4A14; }
.wpforms-container .wpforms-form input:focus,
.wpforms-container .wpforms-form textarea:focus,
.wpforms-container .wpforms-form select:focus { border-color: #2F6B1F; box-shadow: 0 0 0 1px #2F6B1F; }