/*
Theme Name: Plastpro
Theme URI: https://plastproinc.com
Author: Plastpro Team
Author URI: https://plastproinc.com
Description: A classic WordPress theme for Plastpro, using traditional PHP templates optimized for the product catalog system.
Requires at least: 5.0
Tested up to: 6.4
Requires PHP: 7.4
Version: 1.0.64
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: plastpro
Tags: classic-theme, custom-menu, featured-images, threaded-comments, translation-ready, e-commerce, custom-post-types

Plastpro WordPress Theme, (C) 2024 Plastpro Inc.
This theme, like WordPress, is licensed under the GPL.
*/

/* CSS Variables */
:root {
	--plastpro-font-family: 'Montserrat', sans-serif;
	--plastpro-font-family-heading: 'Gilda Display', serif;
	--plastpro-orange: #E87722;
	--plastpro-yellow: #FFCC00;
	--plastpro-gray: #7C878E;
	--plastpro-gray-6: #F5F5F5;
	--plastpro-stock-in-color: #E87722;
	--plastpro-stock-out-color: #7C878E;
	--White: #FFF; /* Global white for sections (e.g. blog listing) */
	--masthead-h: 132px; /* Fallback: 100px nav + 32px offer bar (if enabled) */
	--site-container-max: 76rem;
	--site-container-max-wide: 90rem; /* wide alignment (e.g. footer, reviews) */

	/* Global typography scale (use these everywhere; clamp where fluid) */
	--font-size-body:   0.875rem;   /* 14px - client preference */
	--font-size-small:  0.875rem;   /* 14px - labels, captions */
	--font-size-xs:     0.75rem;   /* 12px - overlines, tiny */
	--font-size-large:  1.125rem;   /* 18px */

	/* Headings – fluid with clamp */
	--font-size-h1: clamp(1.75rem, 5vw, 3rem);           /* ~28px – 48px */
	--font-size-h2: clamp(1.5rem, 4vw, 2.25rem);         /* ~24px – 36px */
	--font-size-h3: clamp(1.25rem, 2.5vw, 1.5rem);       /* ~20px – 24px */
	--font-size-h4: 1.25rem;
	--font-size-h5: 1.125rem;
	--font-size-h6: 1rem;

	/* Hero/display size for big page titles */
	--font-size-display: clamp(2rem, 6vw, 3.75rem);       /* ~32px – 60px */

	/* Blog single post h2 – fluid, max 2rem */
	--font-size-h2-single: clamp(1.5rem, 2.5vw, 2rem);

	/* Section titles (e.g. Featured Series, Featured Article intro line 2) – 40px */
	--font-size-section-title: 2.5rem;
}

/* Editor color palette – frontend styles for blocks (matches editor-color-palette in class-theme-setup.php) */
.has-plastpro-orange-color { color: #E87722; }
.has-plastpro-orange-background-color { background-color: #E87722; }
.has-plastpro-yellow-color { color: #FFCC00; }
.has-plastpro-yellow-background-color { background-color: #FFCC00; }
.has-plastpro-gray-color { color: #7C878E; }
.has-plastpro-gray-background-color { background-color: #7C878E; }
.has-plastpro-gray-6-color { color: #F5F5F5; }
.has-plastpro-gray-6-background-color { background-color: #F5F5F5; }
.has-white-color { color: #FFFFFF; }
.has-white-background-color { background-color: #FFFFFF; }
.has-plastpro-dark-color { color: #1D252D; }
.has-plastpro-dark-background-color { background-color: #1D252D; }

/* Reusable CTA Button Style */
.cta-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	color: #1D252D;
	font-size: var(--font-size-small);
	font-family: var(--plastpro-font-family, 'Montserrat', sans-serif);
	font-weight: 700;
	text-transform: uppercase;
	line-height: 22px;
	word-wrap: break-word;
	text-decoration: none;
	text-align: center;
	letter-spacing: 0;
	transition: all 0.3s ease;
	cursor: pointer;
}

/* CTA Button Variants */
.cta-button--text {
	background: none;
	border: none;
	padding: 0;
}

.cta-button--text:hover {
	color: var(--plastpro-orange, #E87722);
}

.cta-button--filled {
	display: inline-block;
	background-color: var(--plastpro-yellow, #FFCC00);
	color: #1D252D;
	font-family: var(--plastpro-font-family, 'Montserrat', sans-serif);
	font-size: var(--font-size-small);
	font-weight: 700;
	line-height: 22px;
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	padding: 8px 20px;
	border-radius: 20px;
	border: none;
	transition: background-color 0.3s ease;
	cursor: pointer;
}

.cta-button--filled:hover {
	background-color: #C65A0F;
	color: #1D252D;
}

.cta-button--filled::after {
	content: '';
	display: inline-block;
	width: 6px;
	height: 10px;
	margin-left: 0.5rem;
	background-image: url("data:image/svg+xml,%3Csvg width='6' height='10' viewBox='0 0 6 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L1 9' stroke='%23FFFFFF' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	vertical-align: middle;
}

.cta-button--outlined {
	padding: 1rem 2.5rem;
	background: transparent;
	color: #1D252D;
	border: 2px solid #1D252D;
	border-radius: 50px;
}

.cta-button--outlined:hover {
	background: #1D252D;
	color: #FFFFFF;
}

/* Primary CTA (orange – same as Where to Buy; reuse for View More, etc.) */
.cta-button--primary,
.where-to-buy-button {
	display: inline-block;
	background-color: var(--plastpro-orange, #E87722);
	color: #FFFFFF;
	font-family: var(--plastpro-font-family, 'Montserrat', sans-serif);
	font-size: var(--font-size-small);
	font-weight: 700;
	line-height: 22px;
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	padding: 8px 20px;
	border-radius: 20px;
	border: none;
	transition: background-color 0.3s ease;
	cursor: pointer;
}

.cta-button--primary:hover,
.where-to-buy-button:hover {
	background-color: #d66a1a;
	color: #FFFFFF;
}

/* Featured Series Footer */
.featured-series-footer {
	text-align: center;
	margin-top: 2rem;
}

/* Featured Series Title (H2 section heading) */
.featured-series-title {
	font-size: var(--font-size-section-title);
	font-family: var(--plastpro-font-family, 'Montserrat', sans-serif);
	font-weight: 300;
	line-height: 1.2;
	word-wrap: break-word;
	margin-bottom: 2.5rem;
	color: #1D252D;
	text-align: center;
}

/* Series Card Title */
.series-card-title {
	font-family: 'Montserrat', sans-serif;
	font-size: 1.5rem; /* 24px - H4 */
	font-weight: 700;
	line-height: 1.25;
	margin: 0 0 30px 0;
	color: #1D252D;
}

/* Reusable Learn More / CTA Button Style */
.learn-more-link,
.wp-block-button.is-style-learn-more .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	color: var(--plastpro-orange, #E87722);
	font-family: var(--plastpro-font-family, 'Montserrat', sans-serif);
	font-size: var(--font-size-small);
	font-weight: 700;
	line-height: 22px;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0;
	transition: color 0.3s ease;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
}

.learn-more-link:hover,
.learn-more-link:focus,
.wp-block-button.is-style-learn-more .wp-block-button__link:hover,
.wp-block-button.is-style-learn-more .wp-block-button__link:focus {
	color: #C65A0F;
}

.learn-more-link::after,
.wp-block-button.is-style-learn-more .wp-block-button__link::after {
	content: '';
	display: inline-block;
	width: 6px;
	height: 10px;
	margin-left: 10px;
	background-image: url("data:image/svg+xml,%3Csvg width='6' height='10' viewBox='0 0 6 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L1 9' stroke='%23E87722' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	vertical-align: middle;
	transition: background-image 0.3s ease;
}

.learn-more-link:hover::after,
.learn-more-link:focus::after,
.wp-block-button.is-style-learn-more .wp-block-button__link:hover::after,
.wp-block-button.is-style-learn-more .wp-block-button__link:focus::after {
	background-image: url("data:image/svg+xml,%3Csvg width='6' height='10' viewBox='0 0 6 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L1 9' stroke='%23C65A0F' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Gutenberg style: Plastpro Button (nav-like CTA with automatic right arrow) */
.wp-block-button.is-style-plastpro-button .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 38px;
	padding: 8px 20px;
	border-radius: 20px;
	font-family: var(--plastpro-font-family, 'Montserrat', sans-serif);
	font-size: var(--font-size-small);
	font-weight: 700;
	line-height: 22px;
	text-transform: uppercase;
	text-decoration: none;
}

.wp-block-button.is-style-plastpro-button .wp-block-button__link::after {
	content: '';
	display: inline-block;
	width: 6px;
	height: 10px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	background-image: url("data:image/svg+xml,%3Csvg width='6' height='10' viewBox='0 0 6 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L1 9' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Reset and Base Styles */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	width: 100%;
	/* Removed overflow-x: hidden to allow sticky positioning to work */
}

body {
	font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
	font-size: var(--font-size-h6);
	line-height: 1.6;
	color: #1D252D;
	background-color: var(--plastpro-gray-6, #F5F5F5);
	width: 100%;
	/* Removed overflow-x: hidden to allow sticky positioning to work */
	max-width: 100vw; /* Prevent horizontal overflow without breaking sticky */
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	line-height: 1.2;
	margin-bottom: 1rem;
}

/* Page content: headings not bold (h2 gets block-header style below) */
.page-content-wrapper-custom h1,
.page-content-wrapper-custom h3,
.page-content-wrapper-custom h4,
.page-content-wrapper-custom h5,
.page-content-wrapper-custom h6 {
	font-weight: 400;
}

/* Block section headers: same as single post (You May Also Like / Ready for More Inspiration); Reviews and featured-article card title left as-is */
.page-content-wrapper-custom h2:not(.reviews-title):not(.blog-featured-article__title):not(.featured-document-title):not(.how-we-got-here__title):not(.meet-the-founders__title):not(.join-our-team__title):not(.testing-information-tabs-heading):not(.testing-information-search-tool-heading) {
	font-family: var(--plastpro-font-family, 'Montserrat', sans-serif);
	font-size: var(--font-size-section-title);
	font-weight: 300;
	line-height: 1.3;
}

/* Series card title stays bold (H4 at 24px) */
.page-content-wrapper-custom .series-card-title {
	font-weight: 700;
}

p {
	margin-bottom: 1rem;
}

a {
	color: #E87722;
	text-decoration: none;
	transition: color 0.3s ease;
}

a:hover {
	color: #1D252D;
}

/* Layout */
.site-container {
	max-width: var(--site-container-max);
	margin: 0 auto;
	overflow-x: hidden; /* Prevent horizontal overflow at container level instead */
}

.site-main {
	padding: 0;
	width: 100%;
	max-width: 100%;
	overflow-x: clip; /* Clip 100vw overflow so full/wide blocks can break out without horizontal scroll */
}

/* Header */
.site-header {
	position: -webkit-sticky; /* Safari support */
	position: sticky;
	top: 0;
	width: 100%;
	max-width: 100%;
	overflow: visible; /* Must be visible for sticky to work */
	overflow-y: visible; /* Explicitly allow vertical overflow for mega menu */
	overflow-x: visible; /* Explicitly allow horizontal overflow */
	z-index: 1000; /* Higher z-index to ensure it stays on top */
	/* Prevent scrollbar in header - mega menu will overflow below */
}

#page {
	width: 100%;
	max-width: 100vw; /* Prevent horizontal overflow without breaking sticky */
	/* Removed overflow-x: hidden to allow sticky positioning to work */
	overflow-y: visible; /* Allow mega menu to overflow vertically */
}

/* Top Offer Bar */
.header-offer-bar {
	background-color: #7C878E;
	height: 32px;
	display: flex;
	align-items: center;
	width: 100%;
	transition: height 0.25s ease, min-height 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
	overflow: hidden;
}

.header-offer-bar.is-hidden {
	height: 0;
	min-height: 0;
	transform: translateY(-100%);
	visibility: hidden;
}

.header-offer-bar .site-container {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin: 0 auto;
	padding: 0 120px;
}

.offer-bar-link {
	display: flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	color: #FFFFFF;
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-small);
	font-weight: 700;
	line-height: 22px;
	transition: opacity 0.3s ease;
}

.offer-bar-link:hover {
	opacity: 0.8;
}

.offer-bar-arrow {
	color: #FFFFFF;
	font-size: var(--font-size-small);
	line-height: 1;
}

.offer-bar-text-only {
	display: flex;
	align-items: center;
	justify-content: center;
}

.offer-bar-text-only .offer-bar-text {
	color: #FFFFFF;
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-small);
	font-weight: 700;
	line-height: 22px;
}

/* Main Navigation Bar */
.header-main-nav {
	background-color: #F5F5F5;
	height: 100px;
	box-shadow: 6px 6px 8px rgba(0, 0, 0, 0.15);
	width: 100%;
	position: relative;
	z-index: 100;
	margin: 0;
	padding: 0;
	overflow: visible; /* Ensure mega menu can overflow below */
}

.header-main-nav .site-container {
	margin: 0 auto;
	height: 100%;
	overflow: visible; /* Allow mega menu to overflow */
}

.header-content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
	gap: 0; /* Use per-element margin-right below for individual spacing */
	position: relative; /* Ensure mega menu positioning context */
	overflow: visible; /* Allow mega menu to overflow */
}

/* Individual spacing between header items (desktop) */
.header-content > .site-branding {
	margin-right: 3.75rem;
}
.header-content > .main-navigation {
	margin-right: 2rem; /* Tighter: search icon closer to menu items */
}
.header-content > .header-search {
	margin-right: 3.75rem;
}
.header-content > .header-cta {
	margin-right: 0;
}

.site-branding {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}

.site-branding .custom-logo-link {
	display: inline-block;
}

.site-branding .custom-logo-link img {
	height: auto;
	max-height: 79px;
	width: auto;
	display: block;
}

.site-branding .custom-logo-link svg {
	height: auto;
	max-height: 79px;
	width: auto;
	display: block;
}

.site-title {
	font-size: var(--font-size-h3);
	font-weight: 700;
	margin: 0;
}

.site-title a {
	color: #1D252D;
	text-decoration: none;
}

/* Navigation */
.main-navigation {
	flex: 1;
	display: flex;
	justify-content: center;
}

.main-navigation ul {
	list-style: none;
	display: flex;
	align-items: center;
	gap: 4rem;
	margin: 0;
	padding: 0;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	color: #000000;
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-small);
	font-weight: 700;
	line-height: 22px;
	text-decoration: none;
	text-transform: uppercase;
	display: flex;
	align-items: center;
	gap: 7px;
	transition: color 0.3s ease;
	position: relative;
}

.main-navigation a::before {
	content: '';
	position: absolute;
	bottom: -10px;
	left: 0;
	width: 0;
	height: 2px;
	background-color: #E87722;
	transition: width 0.3s ease;
}

.main-navigation a:hover {
	color: #7C878E;
}

.main-navigation a:hover::before,
.main-navigation li.mega-menu-open > a::before {
	width: 100%;
}

.main-navigation li.current-menu-item > a,
.main-navigation li.current_page_item > a {
	color: #000000;
}

/* Active menu item underline - removed */

/* Dropdown Arrow (after text) - Plastpro Orange */
.main-navigation a::after {
	content: '';
	width: 9.754px;
	height: 5.69px;
	background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23E87722' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	display: inline-block;
	transition: transform 0.3s ease;
	flex-shrink: 0;
	margin-left: 7px;
}

.main-navigation li.current-menu-item > a::after,
.main-navigation li.current_page_item > a::after {
	background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23E87722' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Mega menu parent with no URL: non-clickable label, same look as link */
.main-navigation .menu-item-label {
	color: #000000;
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-small);
	font-weight: 700;
	line-height: 22px;
	text-decoration: none;
	text-transform: uppercase;
	display: flex;
	align-items: center;
	gap: 7px;
	transition: color 0.3s ease;
	position: relative;
	cursor: pointer;
}
.main-navigation .menu-item-label::before {
	content: '';
	position: absolute;
	bottom: -10px;
	left: 0;
	width: 0;
	height: 2px;
	background-color: #E87722;
	transition: width 0.3s ease;
}
.main-navigation li:hover .menu-item-label {
	color: #7C878E;
}
.main-navigation li:hover .menu-item-label::before,
.main-navigation li.mega-menu-open .menu-item-label::before {
	width: 100%;
}
.main-navigation .menu-item-label::after {
	content: '';
	width: 9.754px;
	height: 5.69px;
	background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23E87722' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	display: inline-block;
	transition: transform 0.3s ease;
	flex-shrink: 0;
	margin-left: 7px;
}

/* Search Icon */
.header-search {
	flex-shrink: 0;
}

.search-toggle {
	background: none;
	border: none;
	padding: 8px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	transition: background-color 0.3s ease;
	border-radius: 50%;
}

.search-toggle:hover {
	background-color: #E5E5E5;
}

/* Active state when search dropdown is open */
body.search-dropdown-open .search-toggle {
	background-color: #E5E5E5;
}

/* Active state when on search page */
body.search .search-toggle {
	background-color: #E5E5E5;
	cursor: default;
	pointer-events: none; /* Disable clicking */
}

.search-toggle svg {
	width: 26px;
	height: 26px;
	flex-shrink: 0;
}

/* Where to Buy Button – uses .cta-button--primary styling (see above) */
.header-cta {
	flex-shrink: 0;
}

/* Content */
.entry-header {
	margin-bottom: 2rem;
}

.entry-title {
	font-size: var(--font-size-h2);
	margin-bottom: 0.5rem;
}

.entry-meta {
	font-size: var(--font-size-small);
	color: rgba(0, 0, 0, 0.6);
	margin-bottom: 1rem;
}

/* Footer */
.site-footer {
	background-color: #1D252D;
	padding: 0;
	width: 100%;
	color: #FFFFFF;
}

.site-footer .site-container {
	max-width: var(--site-container-max-wide);
	margin: 0 auto;
	padding: 80px 20px 40px;
	width: 100%;
	box-sizing: border-box;
}

.footer-content {
	display: grid;
	grid-template-columns: 2fr 1fr;
	grid-template-rows: auto auto;
	gap: 4rem;
	position: relative;
}

.footer-content::after {
	display: none;
}

.footer-columns {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 2rem;
}

.footer-column {
	display: flex;
	flex-direction: column;
}

.footer-heading {
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-large);
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom: 1rem;
	color: #7C878E;
	line-height: 24px;
}

.footer-links {
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-links li {
	margin-bottom: 1.5rem;
	white-space: nowrap;
}

.footer-links li:last-child {
	margin-bottom: 0;
}

.footer-links a {
	color: #FFFFFF;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: var(--font-size-small);
	line-height: 22px;
	text-decoration: none;
	transition: color 0.3s ease;
	display: block;
}

.footer-links a:hover {
	color: #BBBCBC;
}

.footer-branding {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	position: relative;
}

.footer-branding::before {
	content: '';
	position: absolute;
	left: -4rem;
	top: 0;
	bottom: 0;
	width: 1px;
	background-color: #7C878E;
}

.footer-branding .custom-logo-link,
.footer-branding .footer-logo-link {
	display: inline-block;
}

.footer-branding .footer-logo-link img,
.footer-branding .footer-logo-link .footer-logo {
	display: block;
	max-width: 100%;
	height: auto;
}

.footer-branding .footer-logo-link svg,
.footer-branding .footer-logo-link img[src$=".svg"] {
	width: auto;
	height: auto;
	max-width: 100%;
	display: block;
}

.footer-subscribe {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.subscribe-heading {
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-large);
	font-weight: 400;
	line-height: 22px;
	color: #FFFFFF;
	margin: 0;
}

.subscribe-form {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.subscribe-input-wrapper {
	display: flex;
	align-items: center;
	background-color: #F5F5F5;
	border: 1px solid #7C878E;
	border-radius: 0;
	overflow: hidden;
}

.subscribe-input {
	flex: 1;
	padding: 12px 16px;
	border: none;
	background-color: transparent;
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-small);
	font-weight: 400;
	color: #BBBCBC;
	line-height: 22px;
	outline: none;
	transition: opacity 0.3s ease;
}

.subscribe-input::placeholder {
	color: #BBBCBC;
}

.subscribe-input:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.subscribe-button {
	background-color: #E87722;
	border: none;
	padding: 12px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.3s ease, opacity 0.3s ease;
	border-radius: 50%;
	margin-right: 8px;
	width: 44px;
	height: 44px;
	min-width: 44px;
}

.subscribe-button:hover:not(:disabled) {
	background-color: #d66a1a;
}

.subscribe-button:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.subscribe-button.loading {
	opacity: 0.7;
	pointer-events: none;
}

.subscribe-message {
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-small);
	line-height: 18px;
	margin-top: 0.5rem;
	min-height: 18px;
}

.subscribe-message.success {
	color: #4CAF50;
}

.subscribe-message.error {
	color: #f44336;
}

.subscribe-consent-notice {
	font-size: var(--font-size-xs);
	line-height: 1.35;
	margin-top: 0.5rem;
	margin-bottom: 0;
	color: rgba(255, 255, 255, 0.85);
}

.subscribe-consent-notice a {
	color: inherit;
	text-decoration: underline;
}

.subscribe-consent-notice a:hover {
	text-decoration: none;
}

.subscribe-button svg {
	width: 20px;
	height: 20px;
	color: #FFFFFF;
	flex-shrink: 0;
}

.footer-social {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.social-heading {
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-large);
	font-weight: 400;
	line-height: 24px;
	color: #FFFFFF;
	margin: 0;
}

.footer-social .social-links {
	list-style: none;
	display: flex;
	gap: 1rem;
	margin: 0;
	padding: 0;
}

.footer-social .social-links li {
	margin: 0;
}

.footer-social .social-links a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background-color: #7C878E;
	border: 1px solid #5B6770;
	border-radius: 50%;
	color: #1D252D;
	text-decoration: none;
	transition: all 0.3s ease;
}

.footer-social .social-links a:hover {
	background-color: #5B6770;
	border-color: #5B6770;
	color: #1D252D;
}

.footer-social .social-links a svg {
	width: 28px;
	height: 28px;
	fill: currentColor;
}

.footer-bottom {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	padding-top: 1rem;
}

.footer-tagline {
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-h2);
	font-weight: 300;
	font-style: italic;
	line-height: 24px;
	color: #5B6770;
	text-align: left;
	margin: 0;
	grid-column: 1 / -1;
	margin-top: 0;
	margin-bottom: 0;
	padding-bottom: 0.25rem;
}

.footer-copyright {
	text-align: left;
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-small);
	line-height: 18px;
	color: #BBBCBC;
}

.footer-copyright p {
	margin: 0;
}

.footer-copyright a {
	color: #BBBCBC;
	text-decoration: underline;
	transition: color 0.3s ease;
}

.footer-copyright a:hover {
	color: #FFFFFF;
}

/* Front Page Styles */
.hero-section {
	background: linear-gradient(135deg, #1D252D 0%, #2a3540 100%);
	color: hsl(0, 0%, 100%);
	padding: 6rem 2rem;
	text-align: center;
	margin: -2rem -20px 4rem -20px;
}

.hero-content {
	max-width: 800px;
	margin: 0 auto;
}

.hero-title {
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-h1);
	font-weight: 700;
	margin-bottom: 1.5rem;
	color: #FFFFFF;
}

.hero-title .hero-title-reg {
	font-size: 0.55em;
	vertical-align: super;
}

.hero-description {
	font-size: var(--font-size-h4);
	line-height: 1.8;
	margin-bottom: 2.5rem;
	color: rgba(255, 255, 255, 0.9);
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
}

.hero-buttons {
	display: flex;
	gap: 1rem;
	justify-content: center;
	flex-wrap: wrap;
}

.button {
	display: inline-block;
	padding: 1rem 2rem;
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-h6);
	font-weight: 400;
	text-decoration: none;
	border-radius: 4px;
	transition: all 0.3s ease;
	border: 2px solid transparent;
}

.button-primary {
	background-color: #E87722;
	color: #FFFFFF;
}

.button-primary:hover {
	background-color: #d66a1a;
	color: #FFFFFF;
}

.button-secondary {
	background-color: transparent;
	color: #FFFFFF;
	border-color: #FFFFFF;
}

.button-secondary:hover {
	background-color: #FFFFFF;
	color: #1D252D;
}

.button-outline {
	background-color: transparent;
	color: #1D252D;
	border-color: #1D252D;
}

.button-outline:hover {
	background-color: #1D252D;
	color: #FFFFFF;
}

/* Features Section */
.features-section {
	padding: 4rem 0;
	margin-bottom: 4rem;
}

.features-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 3rem;
}

.feature-item {
	text-align: center;
}

.feature-icon {
	color: #E87722;
	margin-bottom: 1.5rem;
	display: flex;
	justify-content: center;
}

.feature-title {
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-h3);
	font-weight: 700;
	margin-bottom: 1rem;
	color: #1D252D;
}

.feature-description {
	color: rgba(0, 0, 0, 0.6);
	line-height: 1.6;
}

/* Products Preview Section */
.products-preview-section {
	padding: 4rem 0;
	margin-bottom: 4rem;
	background-color: #F8F9FA;
	margin: 4rem -20px;
	padding: 4rem 20px;
}

.section-header {
	text-align: center;
	margin-bottom: 3rem;
}

.section-title {
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-h1);
	font-weight: 700;
	margin-bottom: 1rem;
	color: #1D252D;
}

.section-description {
	font-size: var(--font-size-large);
	color: rgba(0, 0, 0, 0.6);
}

.products-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 2rem;
	max-width: 1200px;
	margin: 0 auto;
}

.product-card {
	background-color: #FFFFFF;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.product-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.product-image {
	width: 100%;
	overflow: hidden;
}

.product-content {
	padding: 1.5rem;
}

.product-title {
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-h3);
	font-weight: 700;
	margin-bottom: 0.75rem;
	color: #1D252D;
}

.product-description {
	color: rgba(0, 0, 0, 0.6);
	margin-bottom: 1rem;
	line-height: 1.6;
}

.product-link {
	color: #E87722;
	text-decoration: none;
	font-weight: 400;
	transition: color 0.3s ease;
}

.product-link:hover {
	color: #d66a1a;
}

/* CTA Section */
.cta-section {
	background-color: #D9E1E2;
	padding: 4rem 2rem;
	text-align: center;
	margin: 4rem -20px 0 -20px;
}

.cta-content {
	max-width: 700px;
	margin: 0 auto;
}

.cta-title {
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-h1);
	font-weight: 700;
	margin-bottom: 1rem;
	color: #1D252D;
}

.cta-description {
	font-size: var(--font-size-large);
	color: rgba(0, 0, 0, 0.6);
	margin-bottom: 2rem;
	line-height: 1.6;
}

.cta-buttons {
	display: flex;
	gap: 1rem;
	justify-content: center;
	flex-wrap: wrap;
}

/* Entry Content Styles */
.entry-thumbnail {
	margin-bottom: 2rem;
}

.entry-thumbnail img {
	width: 100%;
	height: auto;
	border-radius: 8px;
}

/* Post content: frontend and block editor (same typography) */
.entry-content,
.editor-styles-wrapper {
	font-size: var(--font-size-body);
	line-height: 1.6;
	font-family: var(--plastpro-font-family);
}

.entry-content p,
.editor-styles-wrapper p {
	margin-bottom: 1rem;
}

.entry-content h1,
.editor-styles-wrapper h1 { font-size: var(--font-size-h1); }
.entry-content h2:not(.find-dealer-title),
.editor-styles-wrapper h2:not(.find-dealer-title) { font-size: var(--font-size-h2); }
.entry-content h3,
.editor-styles-wrapper h3 {
	font-size: var(--font-size-h3);
	font-family: var(--plastpro-font-family);
	font-weight: 400;
	margin-top: 1.5rem;
	margin-bottom: 0.75rem;
	color: #1D252D;
}
.entry-content h4,
.editor-styles-wrapper h4 { font-size: var(--font-size-h4); }
.entry-content h5,
.editor-styles-wrapper h5 { font-size: var(--font-size-h5); }
.entry-content h6,
.editor-styles-wrapper h6 { font-size: var(--font-size-h6); }

/* Mobile Menu Toggle Button */
.mobile-menu-toggle {
	display: none;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	width: 24px;
	height: 24px;
	position: relative;
	flex-shrink: 0;
}

.mobile-menu-toggle .close-icon {
	display: none;
}

.mobile-menu-toggle[aria-expanded="true"] .hamburger-icon {
	display: none;
}

.mobile-menu-toggle[aria-expanded="true"] .close-icon {
	display: block;
}

.mobile-menu-toggle svg {
	width: 100%;
	height: 100%;
	display: block;
}

/* Mobile Menu Overlay */
.mobile-menu-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 9998;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* Adjust overlay position when WordPress admin bar is present */
.admin-bar .mobile-menu-overlay {
	top: 32px;
	height: calc(100vh - 32px);
}

@media screen and (min-width: 782px) {
	.admin-bar .mobile-menu-overlay {
		top: 46px;
		height: calc(100vh - 46px);
	}
}

.mobile-menu-overlay.active {
	opacity: 1;
	visibility: visible;
}

.mobile-menu-container {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	max-width: 100%;
	height: 100vh;
	background-color: #FFFFFF;
	border-radius: 0 0 20px 20px; /* Rounded bottom corners */
	z-index: 9999;
	overflow-y: auto;
	transform: translateX(-100%);
	transition: transform 0.3s ease;
	display: flex;
	flex-direction: column;
}

/* Adjust container position when WordPress admin bar is present */
.admin-bar .mobile-menu-container {
	top: 32px;
	height: calc(100vh - 32px);
}

@media screen and (min-width: 782px) {
	.admin-bar .mobile-menu-container {
		top: 46px;
		height: calc(100vh - 46px);
	}
}

.mobile-menu-overlay.active .mobile-menu-container {
	transform: translateX(0);
}

/* Mobile Menu Header */
.mobile-menu-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px;
	border-bottom: 1px solid #E5E5E5;
	flex-shrink: 0;
}

.mobile-menu-logo {
	flex: 1;
}

.mobile-menu-logo .custom-logo-link img,
.mobile-menu-logo .custom-logo-link svg {
	max-height: 40px;
	width: auto;
}

.mobile-menu-close {
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.mobile-menu-close svg {
	width: 100%;
	height: 100%;
}

/* Mobile Menu Navigation */
.mobile-menu-navigation {
	flex: 1;
	padding: 0;
	overflow-y: auto;
}

.mobile-primary-menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.mobile-primary-menu .menu-item {
	border-bottom: 1px solid #E5E5E5;
}

.mobile-primary-menu .menu-item:last-child {
	border-bottom: none;
}

.mobile-primary-menu .menu-item a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px;
	color: #1D252D;
	font-family: 'Montserrat', sans-serif;
	font-size: var(--font-size-h6);
	font-weight: 700;
	line-height: 22px;
	text-decoration: none;
	text-transform: uppercase;
	transition: color 0.3s ease;
}

.mobile-primary-menu .menu-item a:hover {
	color: #7C878E;
}

.mobile-primary-menu .menu-item a::after {
	content: '';
	width: 9.754px;
	height: 5.69px;
	background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23E87722' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	display: inline-block;
	flex-shrink: 0;
	margin-left: 10px;
}

/* Hide down arrow for mega menu items - they use right arrow from plugin */
.mobile-primary-menu .menu-item.has-mega-menu > a::after {
	display: none;
}

/* Mobile Menu Divider */
.mobile-menu-divider {
	height: 1px;
	background-color: #E5E5E5;
	margin: 20px;
	flex-shrink: 0;
}

/* Mobile Menu Search */
.mobile-menu-search {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 20px;
	flex-shrink: 0;
}

.mobile-search-toggle {
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.3s ease;
}

.mobile-search-toggle:hover {
	opacity: 0.7;
}

.mobile-search-toggle svg {
	width: 100%;
	height: 100%;
}

/* Mobile Menu CTA */
.mobile-menu-cta {
	padding: 20px 20px 0 20px; /* Remove bottom padding, button handles it */
	flex-shrink: 0;
}

.mobile-where-to-buy-button {
	display: block;
	background-color: var(--plastpro-orange, #E87722);
	color: #FFFFFF;
	font-size: var(--font-size-small);
	font-weight: 700;
	line-height: 22px;
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	padding: 12px 20px;
	border-radius: 0 0 20px 20px; /* Rounded bottom corners only */
	width: 100%;
	transition: background-color 0.3s ease;
	margin: 0;
}

.mobile-where-to-buy-button:hover {
	background-color: #d66a1a;
	color: #FFFFFF;
}

/* Ensure button extends to container edges with rounded bottom */
.mobile-menu-cta .mobile-where-to-buy-button {
	margin-left: -20px;
	margin-right: -20px;
	width: calc(100% + 40px); /* Extend beyond padding */
	border-radius: 0 0 20px 20px; /* Match container rounded corners */
}

/* Prevent body scroll when mobile menu is open */
body.mobile-menu-open {
	overflow: hidden;
}

/* Tablet Responsive - Adjust navigation for tablet sizes */
@media (min-width: 769px) and (max-width: 1024px) {
	.main-navigation ul {
		gap: 1rem;
	}

	.main-navigation a,
	.main-navigation .menu-item-label {
		font-size: var(--font-size-xs);
	}

	.where-to-buy-button {
		width: auto;
		padding: 8px 14px;
		font-size: 11px;
		white-space: nowrap;
		min-width: auto;
	}

	.header-content {
		gap: 0.75rem;
	}
	.header-content > .site-branding,
	.header-content > .main-navigation,
	.header-content > .header-search,
	.header-content > .header-cta {
		margin-right: 0; /* Use uniform gap on tablet */
	}

	.site-branding .custom-logo-link img,
	.site-branding .custom-logo-link svg {
		max-height: 60px;
	}
}

/* Header nav height between 820px and 1024px */
@media (min-width: 820px) and (max-width: 1024px) {
	.header-main-nav {
		height: 70px;
	}
}

/* Smaller Tablets (iPad Air, etc.) - More aggressive spacing */
@media (min-width: 769px) and (max-width: 900px) {
	.main-navigation ul {
		gap: 0.75rem;
	}

	.main-navigation a,
	.main-navigation .menu-item-label {
		font-size: 11px;
		padding: 0 2px;
	}

	.where-to-buy-button {
		padding: 8px 12px;
		font-size: 10px;
	}

	.header-content {
		gap: 0.5rem;
	}
	.header-content > .site-branding,
	.header-content > .main-navigation,
	.header-content > .header-search,
	.header-content > .header-cta {
		margin-right: 0; /* Use uniform gap on smaller tablet */
	}

	.header-search {
		margin-right: 0.25rem;
	}
}

/* Responsive */
@media (max-width: 768px) {
	/* Top Offer Bar - Mobile adjustments */
	.header-offer-bar {
		height: auto;
		min-height: 32px;
		padding: 6px 0;
	}

	.header-offer-bar .site-container {
		padding: 0 15px;
	}

	.offer-bar-link,
	.offer-bar-text-only .offer-bar-text {
		font-size: var(--font-size-xs);
		line-height: 1.4;
		text-align: center;
		padding: 4px 0;
	}

	.offer-bar-arrow {
		font-size: var(--font-size-xs);
	}

	/* Hide desktop navigation elements on mobile */
	.main-navigation,
	.header-search,
	.header-cta {
		display: none;
	}

	/* Show mobile menu toggle on mobile */
	.mobile-menu-toggle {
		display: block;
	}

	/* Adjust header content for mobile */
	.header-content {
		justify-content: space-between;
	}

	/* Show mobile menu overlay and container on mobile */
	.mobile-menu-overlay {
		display: block;
	}
	
	.mobile-menu-container {
		display: flex;
	}

	/* Adjust header main nav height for mobile */
	.header-main-nav {
		height: 70px;
		box-shadow: 6px 6px 8px rgba(0, 0, 0, 0.15);
	}

	.header-main-nav .site-container {
		padding-left: 1rem;
		padding-right: 1rem;
	}

	/* Adjust logo size for mobile */
	.site-branding .custom-logo-link img,
	.site-branding .custom-logo-link svg {
		max-height: 50px;
	}
	.hero-section {
		padding: 4rem 1rem;
		margin: -2rem -20px 3rem -20px;
	}

	.hero-title {
		font-size: var(--font-size-h2);
	}

	.hero-description {
		font-size: var(--font-size-large);
	}

	.features-grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.products-grid {
		grid-template-columns: 1fr;
	}

	.section-title,
	.cta-title {
		font-size: var(--font-size-h2);
	}

	.featured-series-title {
		font-size: var(--font-size-section-title);
		line-height: 1.2;
	}

	.series-card-title {
		font-size: 1.5rem; /* 24px - H4 */
		font-weight: 700;
		line-height: 1.25;
		margin: 0 0 10px 0;
	}

	.site-footer .site-container {
		padding: 60px 40px 30px;
	}

	.footer-content {
		grid-template-columns: 1fr;
		gap: 3rem;
	}

	.footer-content::after {
		display: none;
	}
	
	.footer-columns {
		grid-template-columns: repeat(2, 1fr);
		gap: 2rem;
	}

	.footer-tagline {
		text-align: left;
		font-size: var(--font-size-h2);
	}
}

/****************** Hero Template Styles *******************/

/* Importar fuente Gilda Display */
@import url('https://fonts.googleapis.com/css2?family=Gilda+Display&display=swap');

/* Hero: full-bleed (100vw + breakout). Clipped by .site-main so no horizontal scroll. */
.hero-section {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: #ffffff;
    padding: 0 !important;
    margin: 0 !important;
    min-height: var(--plastpro-hero-min-height);
    display: flex;
    align-items: flex-end;
	display: grid;
    justify-items: start;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    box-sizing: border-box;
}

/* Overlay oscuro sobre la imagen para mejor legibilidad */
.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 1;
}

.hero-container {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    padding: 40px 1.5rem 60px;
    text-align: center;
    box-sizing: border-box;
}

.hero-title {
    font-family: 'Gilda Display', serif;
    font-size: 5rem;
    font-weight: 400;
    margin: 0 auto;
    line-height: 1.1;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.6);
    letter-spacing: 0.02em;
    text-align: center;
    max-width: 100%;
    display: block;
}

/* Contenedor del contenido de la página (debajo del hero) - full width so no body gray on sides */
.page-content-wrapper-custom {
    padding-top: 20px;
    margin: 0;
    width: 100%;
    max-width: none;
    overflow: visible;
    font-size: var(--font-size-large);
    line-height: 1.8;
}

.page-content-wrapper-custom > p {
    margin-bottom: 20px;
}

/* Hero template: white background on content wrapper only */
.page-content-wrapper-custom--white-bg {
    background-color: #fff;
}

/* Hero template: post_content area uses body background (no white); spacing after hero image */
.hero-section + .page-content-wrapper-custom {
    background-color: transparent;
    padding-top: 3rem !important;
}

/* background-expand-full: break out of constrained parent (100vw); clipped by .site-main */
.entry-content .background-expand-full,
.page-content-wrapper-custom .background-expand-full {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    box-sizing: border-box;
}
.entry-content .background-expand-full > p,
.entry-content .background-expand-full > .wp-block-group__inner-container,
.page-content-wrapper-custom .background-expand-full > p,
.page-content-wrapper-custom .background-expand-full > .wp-block-group__inner-container {
    max-width: var(--site-container-max);
    margin-left: auto;
    margin-right: auto;
    padding-left: max(20px, (100vw - var(--site-container-max)) / 2);
    padding-right: max(20px, (100vw - var(--site-container-max)) / 2);
    box-sizing: border-box;
}

/* background-expand-bottom: add in Block → Advanced → Additional CSS class(es). Only the bottom of the block background expands full width; content stays at content width. Extends through wrapper bottom padding (e.g. .page-content--default 4rem). */
.page-content-wrapper-custom:has(.background-expand-bottom),
.entry-content:has(.background-expand-bottom) {
    overflow: visible;
}
.entry-content .background-expand-bottom,
.page-content-wrapper-custom .background-expand-bottom {
    position: relative;
    padding-bottom: 4rem;
    box-sizing: border-box;
}
.entry-content .background-expand-bottom::after,
.page-content-wrapper-custom .background-expand-bottom::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    bottom: -4rem;
    height: 8rem;
    background: inherit;
    z-index: -1;
}
.entry-content .background-expand-bottom > p,
.entry-content .background-expand-bottom > .wp-block-group__inner-container,
.page-content-wrapper-custom .background-expand-bottom > p,
.page-content-wrapper-custom .background-expand-bottom > .wp-block-group__inner-container {
    max-width: var(--site-container-max);
    margin-left: auto;
    margin-right: auto;
    padding-left: max(20px, (100vw - var(--site-container-max)) / 2);
    padding-right: max(20px, (100vw - var(--site-container-max)) / 2);
    box-sizing: border-box;
}

/* background-expand-top: add in Block -> Advanced -> Additional CSS class(es).
   Expands only the top portion of a block background to full width while
   keeping content constrained. Default top expansion is 4rem. */
.page-content-wrapper-custom:has(.background-expand-top),
.entry-content:has(.background-expand-top) {
    overflow: visible;
}
.entry-content .background-expand-top,
.page-content-wrapper-custom .background-expand-top {
    position: relative;
    --expand-top: 4rem;
    box-sizing: border-box;
    isolation: isolate;
}
.entry-content .background-expand-top::before,
.page-content-wrapper-custom .background-expand-top::before {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    top: calc(-1 * var(--expand-top));
    height: calc(100% + var(--expand-top));
    background: inherit;
    z-index: -1;
}
.entry-content .background-expand-top > p,
.entry-content .background-expand-top > .wp-block-group__inner-container,
.page-content-wrapper-custom .background-expand-top > p,
.page-content-wrapper-custom .background-expand-top > .wp-block-group__inner-container {
    max-width: var(--site-container-max);
    margin-left: auto;
    margin-right: auto;
    padding-left: max(20px, (100vw - var(--site-container-max)) / 2);
    padding-right: max(20px, (100vw - var(--site-container-max)) / 2);
    box-sizing: border-box;
}

/* Optional utilities for top expansion amount. Combine with .background-expand-top */
.entry-content .background-expand-top.top-2,
.page-content-wrapper-custom .background-expand-top.top-2 { --expand-top: 2rem; }
.entry-content .background-expand-top.top-4,
.page-content-wrapper-custom .background-expand-top.top-4 { --expand-top: 4rem; }
.entry-content .background-expand-top.top-6,
.page-content-wrapper-custom .background-expand-top.top-6 { --expand-top: 6rem; }

/* Constrain default block width (paragraphs, etc.) to site content width; full-bleed blocks break out via .alignwide/.alignfull; exclude .documents-tabs-section, .dealer-locator-wrap (where-to-buy uses site-container-max-wide) */
.page-content-wrapper-custom > *:not(.alignfull):not(.alignwide):not(.documents-tabs-section):not(.featured-document-section):not(.dealer-locator-wrap) {
    max-width: var(--site-container-max) !important;
    width: 100%;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
}

/* Ensure block wrappers and paragraphs also constrained (in case structure differs) */
.page-content-wrapper-custom > p:not([class*="alignfull"]):not([class*="alignwide"]),
.page-content-wrapper-custom > .wp-block-paragraph:not(.alignfull):not(.alignwide),
.page-content-wrapper-custom > .wp-block-heading:not(.alignfull):not(.alignwide) {
    max-width: var(--site-container-max) !important;
    width: 100%;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
}

/* Full/wide: break out of constrained .entry-content (100vw); clipped by .site-main = no horizontal scroll */
.page-content-wrapper-custom .alignfull,
.page-content-wrapper-custom .alignwide {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    box-sizing: border-box;
}

/* Full: section fills the 100vw wrapper. Wide: section constrained to site-container-max-wide and centered */
.page-content-wrapper-custom .alignfull .technical-documents-component,
.page-content-wrapper-custom .alignfull .contact-us-component,
.page-content-wrapper-custom .alignfull .featured-document-component,
.page-content-wrapper-custom .alignfull .find-dealer-component,
.page-content-wrapper-custom .alignfull .why-plastpro,
.page-content-wrapper-custom .alignfull .how-we-got-here,
.page-content-wrapper-custom .alignfull .meet-the-founders,
.page-content-wrapper-custom .alignfull .category-posts,
.page-content-wrapper-custom .alignfull .join-our-team {
    width: 100%;
    min-width: 100%;
}

.page-content-wrapper-custom .alignwide .technical-documents-component,
.page-content-wrapper-custom .alignwide .contact-us-component,
.page-content-wrapper-custom .alignwide .featured-document-component,
.page-content-wrapper-custom .alignwide .find-dealer-component,
.page-content-wrapper-custom .alignwide .why-plastpro,
.page-content-wrapper-custom .alignwide .how-we-got-here,
.page-content-wrapper-custom .alignwide .meet-the-founders,
.page-content-wrapper-custom .alignwide .category-posts,
.page-content-wrapper-custom .alignwide .join-our-team {
    max-width: var(--site-container-max-wide);
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    box-sizing: border-box;
}

/* Default page template: title like HydroShield (centered, Gilda Display, dark) */
.page-content--default .page-title-centered {
    font-family: var(--plastpro-font-family-heading, 'Gilda Display', serif);
    font-size: var(--font-size-h1);
    font-weight: 400;
    color: #1D252D;
    margin: 0 auto 3rem auto;
    line-height: 1.2;
    max-width: var(--site-container-max);
    text-align: center;
}

.page-content--default {
    padding: 2rem 20px 0rem;
}

/* Page template only: more space between nav and title */
.site-main > .page-content-wrapper-custom.page-content--default:first-child {
    padding-top: 4rem;
}

/* Where to buy template: dealer locator section uses wide container */
.dealer-locator-wrap.dealer-locator-figma {
    max-width: var(--site-container-max-wide);
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    box-sizing: border-box;
}

/* Responsive */
@media (max-width: 768px) {
    .hero-title {
        font-size: var(--font-size-h1);
    }
    
    .hero-section {
        min-height: var(--plastpro-hero-min-height-mobile);
    }
    
    .hero-container {
        padding: 30px 0 40px 0;
    }
    
    .page-content-wrapper-custom {
        padding-top: 20px;
    }

    .hero-section + .page-content-wrapper-custom {
        padding-top: 2rem !important;
    }
}

/* ==========================================================================
   reCAPTCHA badge – hidden per Google's policy (badge-free usage).
   A required attribution notice is displayed near each protected form instead.
   See: https://developers.google.com/recaptcha/docs/faq#id-like-to-hide-the-recaptcha-badge.-what-is-allowed
   ========================================================================== */
.grecaptcha-badge {
    visibility: hidden !important;
}

.recaptcha-notice {
    font-size: 0.75rem;
    color: #888;
    margin-top: 0.5rem;
    line-height: 1.4;
}

.recaptcha-notice a {
    color: inherit;
    text-decoration: underline;
}