/*
Theme Name: PipeRepair Pro
Theme URI: https://piperepair.com.sg
Author: [Your Company]
Description: Modern corporate theme for New Horizon Pte Ltd (piperepair.com.sg). Sticky header with dropdown navigation, full landing-page home (hero, services, why-us, CTA), modern inner pages, and a compatibility layer for content migrated from Joomla. Installable alongside the classic theme — switch anytime.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: piperepair-pro
*/

/* =========================================================
   1. Design tokens
   ========================================================= */
:root {
	--pp-orange:       #ff4625;
	--pp-orange-dark:  #e33414;
	--pp-navy:         #16202e;
	--pp-navy-soft:    #1f2c3d;
	--pp-ink:          #22303f;
	--pp-body:         #4a5568;
	--pp-muted:        #8494a7;
	--pp-line:         #e5e9ef;
	--pp-bg:           #ffffff;
	--pp-bg-soft:      #f5f7fa;
	--pp-radius:       10px;
	--pp-shadow:       0 10px 30px rgba(22, 32, 46, 0.10);
	--pp-shadow-soft:  0 4px 14px rgba(22, 32, 46, 0.07);
	--pp-container:    1200px;
	--pp-font:         'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* =========================================================
   2. Base
   ========================================================= */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: var(--pp-font);
	font-size: 16px;
	line-height: 1.65;
	color: var(--pp-body);
	background: var(--pp-bg);
	-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; border: 0; }
a { color: var(--pp-orange); text-decoration: none; transition: color .18s ease; }
a:hover { color: var(--pp-orange-dark); }
h1, h2, h3, h4, h5, h6 { color: var(--pp-ink); line-height: 1.25; margin: 0 0 .6em; font-weight: 700; }
h1 { font-size: 42px; } h2 { font-size: 32px; } h3 { font-size: 22px; } h4 { font-size: 18px; }
p { margin: 0 0 1.2em; }
.pp-container { max-width: var(--pp-container); margin: 0 auto; padding: 0 24px; }
.screen-reader-text { position: absolute !important; clip: rect(1px,1px,1px,1px); width: 1px; height: 1px; overflow: hidden; }

.pp-btn {
	display: inline-block; padding: 14px 30px; border-radius: 6px; font-weight: 600; font-size: 15px;
	letter-spacing: .2px; transition: all .2s ease; border: 2px solid transparent; cursor: pointer;
}
.pp-btn-primary { background: var(--pp-orange); color: #fff !important; box-shadow: 0 6px 18px rgba(255, 70, 37, .35); }
.pp-btn-primary:hover { background: var(--pp-orange-dark); transform: translateY(-2px); }
.pp-btn-ghost { border-color: rgba(255,255,255,.65); color: #fff !important; }
.pp-btn-ghost:hover { background: rgba(255,255,255,.12); border-color: #fff; }
.pp-btn-dark { background: var(--pp-navy); color: #fff !important; }
.pp-btn-dark:hover { background: var(--pp-navy-soft); transform: translateY(-2px); }

.pp-section { padding: 84px 0; }
.pp-section-soft { background: var(--pp-bg-soft); }
.pp-kicker {
	display: inline-block; text-transform: uppercase; letter-spacing: 2.5px; font-size: 12.5px;
	font-weight: 700; color: var(--pp-orange); margin-bottom: 12px;
}
.pp-section-head { max-width: 640px; margin: 0 auto 52px; text-align: center; }
.pp-section-head p { color: var(--pp-muted); font-size: 17px; }

/* =========================================================
   3. Top bar + header + navigation
   ========================================================= */
.pp-topbar { background: var(--pp-navy); color: #c6d0dc; font-size: 13.5px; }
.pp-topbar .pp-container { display: flex; justify-content: space-between; align-items: center; min-height: 38px; flex-wrap: wrap; }
.pp-topbar a { color: #fff; }
.pp-topbar a:hover { color: var(--pp-orange); }
.pp-topbar .fa { color: var(--pp-orange); margin-right: 6px; }
.pp-topbar-contact { display: flex; align-items: center; flex-wrap: wrap; }
.pp-topbar-contact span { margin-left: 22px; white-space: nowrap; }
.pp-topbar-note { white-space: nowrap; }
.pp-topbar-menu {
	display: inline-flex; gap: 18px; margin-left: 24px; padding-left: 22px;
	border-left: 1px solid rgba(255,255,255,.18);
}
.pp-topbar-menu a { color: #fff; font-weight: 500; }
.pp-topbar-menu a:hover { color: var(--pp-orange); }

.pp-header {
	position: sticky; top: 0; z-index: 999; background: #fff;
	border-bottom: 1px solid var(--pp-line); transition: box-shadow .25s ease;
}
.pp-header.scrolled { box-shadow: var(--pp-shadow-soft); }
.pp-header .pp-container { display: flex; align-items: center; justify-content: space-between; min-height: 84px; gap: 24px; }
.pp-logo img { display: block; max-height: 44px; width: auto; }
.pp-logo .custom-logo { max-height: 44px; width: auto; }

.pp-nav > ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px; }
.pp-nav > ul > li { position: relative; }
.pp-nav > ul > li > a {
	display: block; padding: 30px 13px; color: var(--pp-ink); font-weight: 600; font-size: 14.5px;
	white-space: nowrap;
}
@media (max-width: 1300px) and (min-width: 1081px) {
	.pp-nav-cta { display: none; }
	.pp-nav > ul > li > a { padding: 30px 10px; font-size: 14px; }
}
/* Home / About / Contact live in the top bar on desktop; keep them drawer-only */
@media (min-width: 1081px) {
	.pp-nav > ul > li.pp-nav-secondary { display: none; }
}
@media (max-width: 640px) {
	.pp-topbar-menu { display: none; }
}
.pp-nav > ul > li > a:hover, .pp-nav > ul > li.current > a { color: var(--pp-orange); }
.pp-nav li.has-sub > a .fa-angle-down { margin-left: 5px; font-size: 13px; opacity: .6; }
.pp-nav .sub-toggle { display: none; }

/* dropdowns (desktop) */
.pp-nav ul.sub-menu {
	position: absolute; top: 100%; left: 0; min-width: 250px; background: #fff; list-style: none;
	margin: 0; padding: 10px 0; border-radius: 0 0 8px 8px; border-top: 3px solid var(--pp-orange);
	box-shadow: var(--pp-shadow); opacity: 0; visibility: hidden; transform: translateY(10px);
	transition: opacity .18s ease, transform .18s ease; z-index: 1000;
}
.pp-nav li:hover > ul.sub-menu, .pp-nav li:focus-within > ul.sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.pp-nav ul.sub-menu li { position: relative; }
.pp-nav ul.sub-menu a { display: block; padding: 9px 22px; color: var(--pp-body); font-size: 14.5px; font-weight: 500; white-space: nowrap; }
.pp-nav ul.sub-menu a:hover { color: var(--pp-orange); background: var(--pp-bg-soft); }
.pp-nav ul.sub-menu li.has-sub > a::after { content: '\f105'; font-family: FontAwesome; float: right; margin-left: 12px; opacity: .5; }
.pp-nav ul.sub-menu ul.sub-menu { top: -13px; left: 100%; border-radius: 8px; }
.pp-nav > ul > li:last-child ul.sub-menu { left: auto; right: 0; }
.pp-nav > ul > li:last-child ul.sub-menu ul.sub-menu { left: auto; right: 100%; }

.pp-nav-cta { margin-left: 12px; }
.pp-nav-cta .pp-btn { padding: 11px 22px; font-size: 14px; }

.pp-nav-toggle {
	display: none; background: none; border: 0; font-size: 26px; color: var(--pp-ink);
	padding: 8px 10px; cursor: pointer;
}

/* =========================================================
   4. Hero
   ========================================================= */
.pp-hero { position: relative; min-height: 620px; display: flex; align-items: center; overflow: hidden; background: var(--pp-navy); }
.pp-hero-slide {
	position: absolute; inset: 0; background-size: cover; background-position: center;
	opacity: 0; transition: opacity 1.4s ease-in-out; transform: scale(1.04);
	/* the legacy slide images carry baked-in text — blur + dim so they read as pure backgrounds */
	filter: brightness(.5) saturate(1.1) blur(4px);
}
.pp-hero-slide.is-active { opacity: 1; transform: scale(1.06); transition: opacity 1.4s ease-in-out, transform 7s ease-out; }
.pp-hero::after {
	content: ''; position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(90deg, rgba(13, 20, 30, .94) 0%, rgba(13, 20, 30, .78) 42%, rgba(13, 20, 30, .38) 100%);
}
.pp-hero-content { position: relative; z-index: 2; max-width: 660px; padding: 96px 0; }
.pp-hero-content .pp-kicker { color: #ffb3a3; }
.pp-hero-content h1 { color: #fff; font-size: 52px; font-weight: 800; letter-spacing: -.5px; margin-bottom: 20px; }
.pp-hero-content h1 span { color: var(--pp-orange); }
.pp-hero-content p { color: rgba(255,255,255,.85); font-size: 19px; max-width: 560px; margin-bottom: 34px; }
.pp-hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.pp-hero-dots { position: absolute; z-index: 2; bottom: 28px; left: 0; right: 0; display: flex; justify-content: center; gap: 10px; }
.pp-hero-dots button { width: 10px; height: 10px; border-radius: 50%; border: 0; background: rgba(255,255,255,.4); cursor: pointer; padding: 0; transition: all .2s; }
.pp-hero-dots button.is-active { background: var(--pp-orange); width: 26px; border-radius: 6px; }

/* =========================================================
   5. Home sections
   ========================================================= */
/* services grid */
/* Flex (not fixed 3-col) so any number of cards stays centred:
   2 cards -> centred pair, 3 -> full row, 4+ -> wrap and centre. */
.pp-services-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 26px; }
.pp-card {
	flex: 1 1 320px; max-width: 380px;
	background: #fff; border: 1px solid var(--pp-line); border-radius: var(--pp-radius);
	padding: 34px 30px; transition: all .25s ease; position: relative; display: block; color: var(--pp-body);
}
.pp-card:hover { transform: translateY(-6px); box-shadow: var(--pp-shadow); border-color: transparent; color: var(--pp-body); }
.pp-card-icon {
	width: 58px; height: 58px; border-radius: 12px; background: rgba(255, 70, 37, .10);
	display: flex; align-items: center; justify-content: center; margin-bottom: 22px;
	font-size: 24px; color: var(--pp-orange); transition: all .25s ease;
}
.pp-card:hover .pp-card-icon { background: var(--pp-orange); color: #fff; }
.pp-card h3 { font-size: 19px; margin-bottom: 10px; }
.pp-card p { font-size: 14.5px; margin-bottom: 16px; color: var(--pp-muted); }
.pp-card-more { font-weight: 600; font-size: 14px; color: var(--pp-orange); }
.pp-card-more .fa { margin-left: 6px; font-size: 12px; transition: transform .2s; }
.pp-card:hover .pp-card-more .fa { transform: translateX(4px); }

/* products strip */
.pp-products-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin-top: 26px; }
.pp-product {
	display: flex; align-items: center; gap: 24px; background: var(--pp-navy); color: #fff;
	border-radius: var(--pp-radius); padding: 32px 34px; transition: all .25s ease;
}
.pp-product:hover { transform: translateY(-4px); box-shadow: var(--pp-shadow); background: var(--pp-navy-soft); }
.pp-product .fa { font-size: 34px; color: var(--pp-orange); flex-shrink: 0; }
.pp-product h3 { color: #fff; font-size: 19px; margin: 0 0 6px; }
.pp-product p { color: #b9c4d2; font-size: 14px; margin: 0; }

/* why us */
.pp-why { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; text-align: center; }
.pp-why-item .fa {
	font-size: 30px; color: var(--pp-orange); background: rgba(255,70,37,.1); width: 74px; height: 74px;
	line-height: 74px; border-radius: 50%; margin-bottom: 18px;
}
.pp-why-item h4 { font-size: 17px; margin-bottom: 8px; }
.pp-why-item p { font-size: 14px; color: var(--pp-muted); margin: 0; }

/* our brands */
.pp-brands-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 30px 56px; }
.pp-brand { display: inline-flex; align-items: center; justify-content: center; transition: transform .2s ease; }
.pp-brand:hover { transform: translateY(-4px); }
.pp-brand img { max-height: 92px; width: auto; max-width: 220px; object-fit: contain; display: block; }

/* certifications */
.pp-certs { display: flex; align-items: center; justify-content: center; gap: 56px; flex-wrap: wrap; }
.pp-certs img { max-height: 92px; width: auto; }
.pp-certs-text { max-width: 420px; }
.pp-certs-text h3 { margin-bottom: 6px; }
.pp-certs-text p { margin: 0; color: var(--pp-muted); font-size: 15px; }

/* CTA band */
.pp-cta { background: linear-gradient(115deg, var(--pp-navy) 0%, #24374e 100%); color: #fff; padding: 68px 0; }
.pp-cta .pp-container { display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.pp-cta h2 { color: #fff; margin: 0 0 8px; font-size: 30px; }
.pp-cta p { color: #b9c4d2; margin: 0; font-size: 16px; }
.pp-cta p a { color: #fff; font-weight: 600; }
.pp-cta p a:hover { color: var(--pp-orange); }
.pp-cta-actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* =========================================================
   6. Inner pages
   ========================================================= */
.pp-page-hero { background: linear-gradient(115deg, var(--pp-navy) 0%, #223349 100%); padding: 58px 0; }
.pp-page-hero h1 { color: #fff; font-size: 36px; margin: 0 0 10px; }
.pp-breadcrumbs { font-size: 13.5px; color: #93a3b5; }
.pp-breadcrumbs a { color: #c6d0dc; }
.pp-breadcrumbs a:hover { color: var(--pp-orange); }
.pp-breadcrumbs .sep { margin: 0 8px; opacity: .5; }

.pp-page-body { padding: 64px 0; }
.pp-page-layout { display: grid; grid-template-columns: 268px minmax(0, 1fr); gap: 48px; align-items: start; }
.pp-page-layout.no-sidebar { grid-template-columns: minmax(0, 1fr); }

/* ===== Contact page ===== */
.pp-contact-page { background: var(--pp-bg-soft); }
.pp-contact { display: grid; grid-template-columns: 370px minmax(0, 1fr); gap: 28px; align-items: start; }

.pp-contact-info { display: flex; flex-direction: column; gap: 16px; }
.pp-info-card { display: flex; gap: 16px; align-items: flex-start; background: #fff; border: 1px solid var(--pp-line); border-radius: 14px; padding: 20px 22px; box-shadow: var(--pp-shadow-soft); }
.pp-info-ic { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 11px; background: rgba(255, 70, 37, .10); color: var(--pp-orange); display: flex; align-items: center; justify-content: center; font-size: 19px; }
.pp-info-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pp-info-label { font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--pp-muted); }
.pp-info-value { font-size: 16px; font-weight: 700; color: var(--pp-ink); line-height: 1.35; }
.pp-info-value a { color: inherit; }
.pp-info-value a:hover { color: var(--pp-orange); }
.pp-info-sub { font-size: 13.5px; color: var(--pp-muted); line-height: 1.45; }

.pp-contact-social { display: flex; gap: 12px; margin-top: 4px; }
.pp-contact-social a { width: 42px; height: 42px; border-radius: 50%; background: #fff; border: 1px solid var(--pp-line); display: flex; align-items: center; justify-content: center; color: var(--pp-navy); font-size: 16px; transition: all .2s ease; }
.pp-contact-social a:hover { background: var(--pp-navy); color: #fff; transform: translateY(-2px); }

.pp-contact-form-card { background: #fff; border: 1px solid var(--pp-line); border-radius: 18px; padding: 38px 40px; box-shadow: var(--pp-shadow); }
.pp-contact-form-card h2 { font-size: 26px; margin: 0 0 6px; color: var(--pp-ink); }
.pp-contact-intro { color: var(--pp-muted); margin: 0 0 26px; font-size: 15px; }

.pp-enquiry .pp-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.pp-enquiry .pp-field { display: flex; flex-direction: column; margin-bottom: 20px; }
.pp-enquiry label { font-size: 14px; font-weight: 600; color: var(--pp-ink); margin-bottom: 8px; }
.pp-enquiry label span { color: var(--pp-orange); }
.pp-enquiry input, .pp-enquiry select, .pp-enquiry textarea { width: 100%; font-family: inherit; font-size: 15px; color: var(--pp-ink); background: var(--pp-bg-soft); border: 1px solid var(--pp-line); border-radius: 10px; padding: 12px 14px; transition: border-color .15s, box-shadow .15s, background .15s; }
.pp-enquiry input:focus, .pp-enquiry select:focus, .pp-enquiry textarea:focus { outline: none; border-color: var(--pp-orange); box-shadow: 0 0 0 3px rgba(255, 70, 37, .12); background: #fff; }
.pp-enquiry textarea { resize: vertical; min-height: 130px; }

.pp-form-error { color: #c0392b; font-size: 14px; margin: 0 0 16px; }

.pp-enquiry-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 4px; }
.pp-btn-send, .pp-btn-wa { display: inline-flex; align-items: center; gap: 9px; font-family: inherit; font-weight: 600; font-size: 15px; border: 0; border-radius: 10px; padding: 14px 24px; cursor: pointer; transition: transform .15s, box-shadow .15s, background .15s; }
.pp-btn-send { background: var(--pp-navy); color: #fff; }
.pp-btn-send:hover { background: #0f1722; transform: translateY(-2px); box-shadow: var(--pp-shadow); }
.pp-btn-wa { background: #25d366; color: #fff; }
.pp-btn-wa:hover { background: #1eb85a; transform: translateY(-2px); box-shadow: var(--pp-shadow); }

.pp-contact-note { display: flex; gap: 9px; align-items: flex-start; margin: 22px 0 0; font-size: 13.5px; color: var(--pp-muted); line-height: 1.5; }
.pp-contact-note .fa { color: #25d366; margin-top: 2px; font-size: 15px; }

@media (max-width: 860px) {
	.pp-contact { grid-template-columns: 1fr; }
	.pp-enquiry .pp-field-row { grid-template-columns: 1fr; gap: 0; }
	.pp-contact-form-card { padding: 28px 22px; }
}

.pp-side-nav { background: var(--pp-bg-soft); border-radius: var(--pp-radius); padding: 26px 22px; position: sticky; top: 108px; }
.pp-side-nav h3 { font-size: 16px; text-transform: uppercase; letter-spacing: 1px; color: var(--pp-ink); margin-bottom: 14px; }
.pp-side-nav ul { list-style: none; margin: 0; padding: 0; }
.pp-side-nav ul ul { padding-left: 16px; }
.pp-side-nav li a {
	display: block; padding: 8px 10px; border-radius: 6px; color: var(--pp-body);
	font-size: 14.5px; font-weight: 500;
}
.pp-side-nav li a:hover { color: var(--pp-orange); background: #fff; }
.pp-side-nav li.current_page_item > a, .pp-side-nav li.current-menu-item > a { color: var(--pp-orange); background: #fff; font-weight: 700; }

/* =========================================================
   7. Content area + legacy (migrated Joomla HTML) compatibility
   ========================================================= */
.entry-content { font-size: 16px; color: var(--pp-body); }
.entry-content h2 { font-size: 26px; margin-top: 1.4em; }
.entry-content h3 { font-size: 21px; margin-top: 1.3em; }
.entry-content h4 { font-size: 18px; margin-top: 1.2em; color: var(--pp-ink); }
.entry-content h5 { font-size: 16px; margin-top: 1.2em; }
.entry-content h6 { font-size: 15px; color: var(--pp-orange); font-weight: 600; }
.entry-content img { border-radius: 6px; }
.entry-content ul { padding-left: 4px; list-style: none; margin: 0 0 1.2em; }
.entry-content ul li { position: relative; padding-left: 20px; margin-bottom: 6px; }
.entry-content ul li::before { content: '\f105'; font-family: FontAwesome; color: var(--pp-orange); position: absolute; left: 2px; }
.entry-content ol { margin: 0 0 1.2em; padding-left: 22px; }
.entry-content ol.alpha { list-style-type: lower-alpha; }
.entry-content a { font-weight: 500; }

/* legacy grid & float helpers used inside migrated content */
.entry-content .fl, .entry-content .left { float: left; }
.entry-content .fr, .entry-content .right { float: right; }
.entry-content .div_clear, .entry-content .mobi_clear { clear: both; height: 0; overflow: hidden; }
.entry-content .grid_full { width: 100%; }
.entry-content .grid_1_2, .entry-content .grid_2_4 { width: 50%; }
.entry-content .grid_1_3 { width: 33.333%; }
.entry-content .grid_2_3 { width: 66.666%; }
.entry-content .grid_1_4 { width: 25%; }
.entry-content .grid_3_4 { width: 75%; }
.entry-content .grid_1_5 { width: 20%; }
.entry-content .grid_2_5 { width: 40%; }
.entry-content .grid_3_5 { width: 60%; }
.entry-content .grid_4_5 { width: 80%; }
.entry-content .grid_2_34 { width: 66.666%; }
.entry-content .b_grid_1_2 { width: 50%; }
.entry-content [class*="grid_"] { min-height: 1px; }

/* full legacy gutter family (ported from the original 960 grid) */
.entry-content .gut_r   { padding-right: 12px; }
.entry-content .gut_l   { padding-left: 12px; }
.entry-content .gut_lr  { padding-left: 12px; padding-right: 12px; }
.entry-content .gut_all { padding: 12px; }
.entry-content .hgut_r  { padding-right: 6px; }
.entry-content .hgut_l  { padding-left: 6px; }
.entry-content .hgut_lr { padding-left: 6px; padding-right: 6px; }
.entry-content .ohgut_r { padding-right: 18px; }
.entry-content .ohgut_l { padding-left: 18px; }
.entry-content .ohgut_lr { padding-left: 18px; padding-right: 18px; }
.entry-content .dgut_r  { padding-right: 28px; }
.entry-content .dgut_l  { padding-left: 28px; }
.entry-content .dgut_lr { padding-left: 28px; padding-right: 28px; }
.entry-content .dgut_all { padding: 28px; }
.entry-content .dgut_b  { padding-bottom: 28px; }
.entry-content .dgut_t  { padding-top: 28px; }
.entry-content .mgut_r  { margin-right: 12px; }
.entry-content .mgut_l  { margin-left: 12px; }

/* product / tile structures used across the service pages */
.entry-content .image img { border: 1px solid var(--pp-line); border-radius: 8px; background: #fff; }
.entry-content .image_inside { padding-bottom: 6px; }
.entry-content .info_inside > h4:first-child,
.entry-content .info_inside > h5:first-child,
.entry-content .info_inside > p:first-child { margin-top: 0; }
.entry-content .name { text-align: center; font-weight: 600; font-size: 15px; margin: 10px 0 16px; }
.entry-content .name a { color: var(--pp-ink); }
.entry-content .name a:hover { color: var(--pp-orange); }
.entry-content .service_inside, .entry-content .section_inside { padding: 4px; }
.entry-content .bordered_products .product_inside { border: 1px solid var(--pp-line); border-radius: var(--pp-radius); padding: 20px; }
.entry-content .product { margin-bottom: 18px; }
.entry-content h4.light { font-weight: 300; }
.entry-content sup { font-size: 11px; }
.entry-content small { font-size: 13px; color: var(--pp-muted); }

/* legacy tables */
.entry-content table { border-collapse: collapse; width: 100%; margin-bottom: 1.4em; }
.entry-content table.standard { border: 1px solid var(--pp-line); border-radius: 8px; overflow: hidden; }
.entry-content table.standard thead tr { border-top: 2px solid var(--pp-line); border-bottom: 2px solid var(--pp-line); }
.entry-content table.standard thead th { font-weight: 700; color: var(--pp-ink); }
.entry-content table.standard tbody tr { border-bottom: 1px solid var(--pp-line); }
.entry-content table.standard tbody tr:last-child { border-bottom: 0; }
.entry-content table.standard tbody tr:nth-child(odd) { background: var(--pp-bg-soft); }
.entry-content table.standard tbody tr td:first-child { font-weight: 600; color: var(--pp-ink); width: 32%; }
/* About Rapp-it sizes table: Size is the LONG column here, so widen it (overrides the 32% above, this page only). */
.page-id-1012 .entry-content table.standard tbody tr td:first-child,
.page-id-1012 .entry-content table.standard thead tr th:first-child { width: 55%; }

/* ===== Weicon food-grade page ===== */
.pp-weicon-intro { margin-bottom: 42px; }
.pp-weicon-intro h2 { font-size: 30px; margin: 8px 0 14px; color: var(--pp-ink); }
.pp-weicon-intro p { font-size: 16px; color: var(--pp-body); line-height: 1.7; max-width: 840px; margin: 0; }
.pp-weicon-certs { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.pp-weicon-certs span { font-size: 12.5px; font-weight: 600; color: var(--pp-navy); background: var(--pp-bg-soft); border: 1px solid var(--pp-line); border-radius: 20px; padding: 6px 14px; }
.pp-weicon-family { margin-bottom: 42px; }
.pp-weicon-family h3 { font-size: 21px; color: var(--pp-ink); margin: 0 0 4px; }
.pp-weicon-fam-intro { color: var(--pp-muted); font-size: 14.5px; line-height: 1.5; margin: 0 0 18px; max-width: 780px; }
.pp-weicon-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(248px, 1fr)); gap: 16px; }
.pp-weicon-card { background: #fff; border: 1px solid var(--pp-line); border-radius: 12px; display: flex; flex-direction: column; overflow: hidden; }
.pp-weicon-thumb { background: #fff; border-bottom: 1px solid var(--pp-line); padding: 16px 16px 12px; text-align: center; }
.pp-weicon-thumb img { display: block; width: 100%; height: 160px; object-fit: contain; }
.pp-weicon-card-body { padding: 18px 20px; display: flex; flex-direction: column; flex: 1; }
.pp-weicon-card h4 { font-size: 15.5px; color: var(--pp-ink); margin: 0 0 8px; line-height: 1.3; }
.pp-weicon-card p { font-size: 13.5px; color: var(--pp-muted); line-height: 1.5; margin: 0 0 12px; flex: 1 0 auto; }
.pp-weicon-badge { align-self: flex-start; font-size: 11px; font-weight: 700; letter-spacing: .03em; color: var(--pp-orange); background: rgba(255, 70, 37, .10); border-radius: 6px; padding: 4px 9px; }
.pp-weicon-cta { padding: 24px 28px; background: var(--pp-bg-soft); border: 1px solid var(--pp-line); border-radius: 12px; }
.pp-weicon-cta p { margin: 0; font-size: 15px; color: var(--pp-body); }
.pp-weicon-cta a { color: var(--pp-orange); font-weight: 600; }
.pp-weicon-dl { display: inline-flex; align-items: center; gap: 10px; margin-top: 24px; background: var(--pp-orange); color: #fff; font-weight: 600; font-size: 15px; padding: 13px 24px; border-radius: 10px; text-decoration: none; transition: background .15s ease, transform .15s ease; }
.pp-weicon-dl:hover { background: var(--pp-orange-dark); color: #fff; transform: translateY(-2px); }
.pp-weicon-dl .fa { font-size: 18px; }
@media (max-width: 600px) { .pp-weicon-grid { grid-template-columns: 1fr; } }
.entry-content table.standard th, .entry-content table.standard td { padding: 12px 16px; text-align: left; font-size: 14.5px; }
.entry-content table.half_and_half { table-layout: fixed; }
.entry-content table.half_and_half td { width: 50%; }
.entry-content table.specs td { vertical-align: top; font-size: 14.5px; padding: 6px 10px; }
.entry-content table.specs td.key { color: var(--pp-muted); }
.entry-content table.specs td.value { color: var(--pp-ink); }

/* legacy boxes / buttons / misc */
.entry-content .grey_box_small_text { font-size: 14px; margin: 14px 0; padding: 16px 18px; background: var(--pp-bg-soft); border-radius: 8px; }
.entry-content .grey_box_small_text h6 { color: var(--pp-orange); font-size: 15px; font-weight: 700; margin: 4px 0 6px; }
.entry-content .grey_box_large_text { font-size: 16.5px; margin: 18px 0; padding: 22px 24px; background: var(--pp-bg-soft); border: 1px solid var(--pp-line); border-radius: var(--pp-radius); }
.entry-content .grey_box_large_text p { margin-bottom: .6em; }
.entry-content .grey_box_large_text .image img { background: #fff; }
.entry-content .orange { color: var(--pp-orange); }
.entry-content a.orange_button {
	background: var(--pp-orange); text-transform: uppercase; color: #fff !important; display: block;
	text-align: center; padding: 13px 18px; border-radius: 6px; font-weight: 600; letter-spacing: .5px;
	font-size: 13.5px; margin-top: 14px; box-shadow: 0 4px 14px rgba(255,70,37,.3);
	transition: all .2s ease;
}
.entry-content a.orange_button:hover { background: var(--pp-orange-dark); transform: translateY(-2px); }
.entry-content .links .link { padding-left: 18px; position: relative; margin-bottom: 8px; }
.entry-content .links .link::before { content: '\f105'; font-family: FontAwesome; color: var(--pp-orange); position: absolute; left: 2px; }
.entry-content .note { font-size: 13px; color: var(--pp-muted); margin: 4px 0 12px; }
.entry-content .step { margin-bottom: 16px; }
.entry-content .step span.big { color: var(--pp-orange); font-size: 26px; float: left; width: 10%; line-height: 1.1; font-weight: 700; }
.entry-content .step span.text { display: block; float: left; width: 90%; }
.entry-content .step img { border: 1px solid var(--pp-line); border-radius: 6px; }
.entry-content .video-responsive { overflow: hidden; padding-bottom: 56.25%; position: relative; height: 0; margin-bottom: 1.4em; border-radius: 8px; }
.entry-content .video-responsive iframe { left: 0; top: 0; height: 100%; width: 100%; position: absolute; }
.entry-content .icon_field { margin-bottom: 8px; }
.entry-content .temp { margin: 0; }

/* legacy contact-page form shell (until replaced by a form plugin) */
.entry-content .form_container { background: var(--pp-bg-soft); border-radius: var(--pp-radius); }
.entry-content .form_container_inside { padding: 22px; }
.entry-content .form_container input.text, .entry-content .form_container textarea, .entry-content .form_container select {
	background: #fff; width: 100%; border: 1px solid var(--pp-line); border-radius: 6px; color: var(--pp-ink);
	padding: 10px 14px; margin-bottom: 10px; font-family: var(--pp-font); font-size: 15px;
}

/* =========================================================
   8. Footer
   ========================================================= */
.pp-footer { background: var(--pp-navy); color: #aebacb; font-size: 14.5px; }
.pp-footer-main { padding: 66px 0 46px; display: grid; grid-template-columns: 1.35fr 1fr 1fr 1fr; gap: 44px; }
.pp-footer h4 { color: #fff; font-size: 15px; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 20px; }
.pp-footer-brand img { max-height: 46px; width: auto; margin-bottom: 18px; background: #fff; padding: 6px 10px; border-radius: 6px; }
.pp-footer p { margin-bottom: 10px; }
.pp-footer a { color: #aebacb; }
.pp-footer a:hover { color: var(--pp-orange); }
.pp-footer ul { list-style: none; margin: 0; padding: 0; }
.pp-footer ul li { margin-bottom: 9px; }
.pp-footer ul li a::before { content: '\f105'; font-family: FontAwesome; margin-right: 8px; color: var(--pp-orange); font-size: 12px; }
.pp-footer .fa-fw { color: var(--pp-orange); margin-right: 6px; }
.pp-footer-certs { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.pp-footer-certs img { max-height: 74px; width: auto; background: #fff; border-radius: 6px; padding: 6px; }
.pp-footer-bottom { border-top: 1px solid rgba(255,255,255,.09); padding: 20px 0; font-size: 13.5px; color: #7f8ea1; }
.pp-footer-bottom .pp-container { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }

/* =========================================================
   9. Responsive
   ========================================================= */
@media (max-width: 1080px) {
	.pp-nav {
		position: fixed; top: 0; right: -320px; width: 300px; height: 100vh; background: #fff;
		box-shadow: -8px 0 30px rgba(0,0,0,.18); transition: right .3s ease; overflow-y: auto;
		z-index: 1001; padding: 84px 18px 40px;
	}
	.pp-nav.open { right: 0; }
	.pp-nav > ul { flex-direction: column; align-items: stretch; gap: 0; }
	.pp-nav > ul > li > a { padding: 13px 10px; border-bottom: 1px solid var(--pp-line); }
	.pp-nav ul.sub-menu {
		position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none;
		border: 0; border-left: 2px solid var(--pp-line); border-radius: 0; padding: 0 0 0 6px;
		margin-left: 10px; display: none; min-width: 0;
	}
	.pp-nav li.sub-open > ul.sub-menu { display: block; }
	.pp-nav ul.sub-menu a { white-space: normal; }
	.pp-nav li.has-sub { position: relative; }
	.pp-nav .sub-toggle {
		display: block; position: absolute; top: 4px; right: 0; background: none; border: 0;
		font-size: 17px; color: var(--pp-muted); padding: 9px 14px; cursor: pointer;
	}
	.pp-nav li.sub-open > .sub-toggle .fa { transform: rotate(180deg); }
	.pp-nav-cta { display: none; }
	.pp-nav-toggle { display: block; position: relative; z-index: 1002; }
	.pp-hero-content h1 { font-size: 40px; }
	.pp-services-grid { grid-template-columns: repeat(2, 1fr); }
	.pp-why { grid-template-columns: repeat(2, 1fr); }
	.pp-footer-main { grid-template-columns: 1fr 1fr; }
	.pp-page-layout { grid-template-columns: 1fr; }
	.pp-side-nav { position: static; order: 2; }
}
@media (max-width: 640px) {
	h1 { font-size: 32px; }
	.pp-section { padding: 56px 0; }
	.pp-topbar-note { display: none; }
	.pp-topbar-contact span { margin-left: 0; margin-right: 18px; }
	.pp-hero { min-height: 540px; }
	.pp-hero-content { padding: 72px 0; }
	.pp-hero-content h1 { font-size: 33px; }
	.pp-services-grid, .pp-products-grid, .pp-why { grid-template-columns: 1fr; }
	.pp-footer-main { grid-template-columns: 1fr; gap: 34px; }
	.pp-cta h2 { font-size: 24px; }
	.pp-page-hero h1 { font-size: 28px; }
	/* collapse legacy grids on phones (mirrors the old template's breakpoint behaviour) */
	.entry-content [class*="grid_"] { width: 100% !important; }
	.entry-content .fl, .entry-content .fr, .entry-content .left, .entry-content .right { float: none; }
	.entry-content [class*="gut_"] { padding-left: 0; padding-right: 0; }
	.entry-content .image_inside { padding-bottom: 14px; }
}

/* WordPress core helpers */
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignright { float: right; margin: 0 0 1em 1.4em; }
.alignleft { float: left; margin: 0 1.4em 1em 0; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 13px; color: var(--pp-muted); text-align: center; }