/**
 * Pave America National — brand theme styles
 * Built on Bootstrap 5.3. Uses DIN Pro (self-hosted).
 */

/* ---------- DIN Pro (self-hosted webfonts) ---------- */
@font-face {
	font-family: "DIN Pro";
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	src: url("../fonts/DINPro-Light.woff2") format("woff2"), url("../fonts/DINPro-Light.woff") format("woff");
}
@font-face {
	font-family: "DIN Pro";
	font-weight: 500;
	font-style: normal;
	font-display: swap;
	src: url("../fonts/DINPro-Medium.woff") format("woff");
}
@font-face {
	font-family: "DIN Pro";
	font-weight: 700;
	font-style: normal;
	font-display: swap;
	src: url("../fonts/DINPro-Bold.woff2") format("woff2"), url("../fonts/DINPro-Bold.woff") format("woff");
}
@font-face {
	font-family: "DIN Pro";
	font-weight: 900;
	font-style: normal;
	font-display: swap;
	src: url("../fonts/DINPro-Black.woff") format("woff");
}

:root {
	--pan-navy:        #1B283F;   /* brand dark blue */
	--pan-navy-2:      #223049;   /* card surface on dark */
	--pan-navy-3:      #2a3a54;
	--pan-navy-line:   #34455f;
	--pan-navy-deep:   #131d2e;   /* darker accent (top sub-nav) */
	--pan-cyan:        #62C6F2;   /* brand light blue */
	--pan-cyan-dark:   #2fa9e0;
	--pan-blue-link:   #2fa9e0;
	--pan-white:       #ffffff;
	--pan-off:         #f4f6f8;
	--pan-gray:        #6D7175;   /* brand body copy */
	--pan-body:        #6D7175;   /* brand body copy */
	--pan-text-dark:   #1B283F;   /* headings / dark text */
	--pan-radius:      6px;
	--pan-font:        "DIN Pro", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--pan-display:     "DIN Pro", var(--pan-font);
}

/* ---------- Base ---------- */
body {
	font-family: var(--pan-font);
	color: var(--pan-body);
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.7;
}

h1, h2, h3, h4, h5, h6,
.pan-logo-text {
	font-family: var(--pan-display);
	font-weight: 700;
	letter-spacing: .01em;
	line-height: 1.1;
	color: var(--pan-text-dark);
}

.site-content { overflow-x: clip; }

/* Section rhythm */
.pan-home > section { padding: 5rem 0; }
.pan-home > section.pan-grid { padding: 0; }
/* ---------- Mode theming (colors come from Theme Settings via wp_head vars) ---------- */
.pan-mode-dark,
.pan-mode-light { background-color: var(--m-bg); color: var(--m-body); }
.pan-mode-dark :is(h1, h2, h3, h4, h5, h6),
.pan-mode-light :is(h1, h2, h3, h4, h5, h6) { color: var(--m-heading); }
.pan-mode-dark a:not(.pan-btn):not(.pan-industries__item):not(.pan-ilcard):not(.pan-breadcrumbs__link):not(.navbar-brand):not(.nav-link):not(.dropdown-item):not(.pan-footer__social-link),
.pan-mode-light a:not(.pan-btn):not(.pan-industries__item):not(.pan-ilcard):not(.pan-breadcrumbs__link):not(.navbar-brand):not(.nav-link):not(.dropdown-item):not(.pan-footer__social-link) { color: var(--m-link); }
.pan-mode-dark a:not(.pan-btn):not(.pan-industries__item):not(.pan-ilcard):not(.pan-breadcrumbs__link):not(.navbar-brand):not(.nav-link):not(.dropdown-item):not(.pan-footer__social-link):hover,
.pan-mode-light a:not(.pan-btn):not(.pan-industries__item):not(.pan-ilcard):not(.pan-breadcrumbs__link):not(.navbar-brand):not(.nav-link):not(.dropdown-item):not(.pan-footer__social-link):hover { color: var(--m-link-hover); }

/* White content containers inside a "dark" (light-blue) section must read as
   LIGHT mode: their text & links use the light palette so they stay legible on
   white (the dark-mode link/hover colors — sometimes white — would vanish).
   Custom properties inherit, so re-pointing --m-* here makes the existing
   .pan-mode-dark heading/link rules resolve to the light values inside the card. */
.pan-mode-dark :is(
	.pan-cservices__card, .pan-cbenefits__box, .pan-stypes__card, .pan-swhy__box,
	.pan-faq, .pan-resources__card, .pan-ilcard, .pan-fcards__card,
	.pan-advantage__box, .pan-tabs__wrap, .pan-contact__card,
	.pan-richtext--boxed .pan-richtext__inner
) {
	--m-body: var(--ml-body);
	--m-heading: var(--ml-heading);
	--m-link: var(--ml-link);
	--m-link-hover: var(--ml-link-hover);
}

/* ---------- Logo text fallback ---------- */
.pan-logo-text {
	font-family: var(--pan-display);
	font-weight: 800;
	font-size: 1.6rem;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: .02em;
	line-height: 1;
}
.pan-logo-text span { color: var(--pan-cyan); }
/* On light chrome (nav/footer), the text fallback must stay legible. */
.pan-mode-light .pan-logo-text { color: var(--m-heading); }

/* ---------- Buttons & links ---------- */
.pan-btn {
	display: inline-block;
	font-family: var(--pan-display);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
	padding: .7rem 1.6rem;
	border-radius: var(--pan-radius);
	text-decoration: none;
	transition: background-color .15s ease, color .15s ease, transform .15s ease;
	border: 2px solid transparent;
	font-size: .9rem;
}
/* Base button colors (used outside moded sections, e.g. header/footer) */
.pan-btn--primary { background: var(--pan-primary); color: #06202e; }
.pan-btn--primary:hover { background: #fff; color: var(--pan-secondary); }
.pan-btn--secondary { background: var(--pan-secondary); color: #fff; border-color: var(--pan-secondary); }
.pan-btn--secondary:hover { background: var(--pan-primary); color: #06202e; border-color: var(--pan-primary); }
.pan-btn--outline { border-color: #fff; color: #fff; }
.pan-btn--outline:hover { background: #fff; color: var(--pan-secondary); }
.pan-btn--white { background: #fff; color: var(--pan-secondary); border-color: #fff; }
.pan-btn--white:hover { background: var(--pan-primary); color: #06202e; border-color: var(--pan-primary); }

/* Moded button colors (from Theme Settings) */
.pan-mode-dark .pan-btn--primary, .pan-mode-light .pan-btn--primary { background: var(--m-b1-bg); color: var(--m-b1-tx); border-color: var(--m-b1-bg); }
.pan-mode-dark .pan-btn--primary:hover, .pan-mode-light .pan-btn--primary:hover { background: var(--m-b1-bgh); color: var(--m-b1-txh); border-color: var(--m-b1-bgh); }
.pan-mode-dark .pan-btn--secondary, .pan-mode-light .pan-btn--secondary { background: var(--m-b2-bg); color: var(--m-b2-tx); border-color: var(--m-b2-bg); }
.pan-mode-dark .pan-btn--secondary:hover, .pan-mode-light .pan-btn--secondary:hover { background: var(--m-b2-bgh); color: var(--m-b2-txh); border-color: var(--m-b2-bgh); }

.pan-link {
	color: var(--pan-blue-link);
	font-weight: 700;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: .35rem;
}
.pan-link:hover { color: var(--pan-cyan); text-decoration: underline; }

/* ---------- Media placeholders ---------- */
.pan-media-placeholder {
	background: linear-gradient(135deg, var(--pan-navy-3), var(--pan-navy-2));
	border: 1px dashed var(--pan-navy-line);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	color: rgba(255, 255, 255, .35);
	min-height: 260px;
	border-radius: var(--pan-radius);
}
.pan-media-placeholder i { font-size: 2.4rem; }
.pan-media-placeholder__label { font-family: var(--pan-display); text-transform: uppercase; letter-spacing: .08em; font-size: .85rem; }

/* ---------- Announcement bar ---------- */
.pan-announcement {
	background: #fff;
	border-bottom: 1px solid #e6eaef;
	font-size: .95rem;
}
.pan-announcement__text { font-weight: 600; color: var(--pan-text-dark); text-align: center; }
.pan-announcement__btn {
	background: var(--pan-navy);
	color: #fff;
	font-family: var(--pan-display);
	text-transform: uppercase;
	letter-spacing: .04em;
	font-weight: 600;
	padding: .45rem 1.3rem;
	border-radius: var(--pan-radius);
	text-decoration: none;
	white-space: nowrap;
}
.pan-announcement__btn:hover { background: var(--pan-cyan); color: #06202e; }

/* ---------- Navbar ---------- */
.pan-navbar {
	background: var(--m-bg);
	border-bottom: 1px solid rgba(0, 0, 0, .08);
	padding-top: .85rem;
	padding-bottom: .85rem;
}
.pan-navbar__brand img { max-width: 250px; height: auto; width: auto; }
.pan-navbar .navbar-nav .nav-link {
	color: var(--m-heading);
	font-family: var(--pan-display);
	font-weight: 600;
	text-transform: none;
	letter-spacing: normal;
	font-size: 14px;
	white-space: nowrap;
	padding: .4rem .75rem;
}
.pan-navbar .navbar-nav .nav-link:hover,
.pan-navbar .navbar-nav .nav-item.active > .nav-link { color: var(--pan-cyan); }
.pan-navbar .navbar-nav .nav-item.dropdown > .nav-link::after {
	color: var(--pan-cyan);
	margin-left: .35rem;
}
.pan-navbar .dropdown-menu {
	background: var(--m-bg);
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: var(--pan-radius);
	box-shadow: 0 8px 24px rgba(0, 0, 0, .1);
	padding: .4rem 0;
	margin-top: 0;
}
.pan-navbar .dropdown-item {
	color: var(--m-body);
	font-weight: 500;
	padding: .5rem 1.1rem;
}
.pan-navbar .dropdown-item:hover { background: var(--pan-off); color: var(--pan-cyan); }
.pan-navbar__phone {
	color: var(--m-heading);
	font-family: var(--pan-display);
	font-weight: 700;
	font-size: 1.15rem;
	text-decoration: none;
	white-space: nowrap;
}
.pan-navbar__phone:hover { color: var(--pan-cyan); }
.navbar-toggler { border-color: rgba(0, 0, 0, .2); }
.navbar-toggler:focus { box-shadow: 0 0 0 .2rem rgba(53, 182, 232, .35); }
.navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%2335b6e8' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
@media (max-width: 1199.98px) {
	.pan-navbar__collapse { padding-top: 1rem; }
	.pan-navbar__actions { padding-top: 1rem; }
	/* Parent link + caret share a row; the submenu drops full-width beneath. */
	.pan-navbar .navbar-nav .nav-item.dropdown { display: flex; flex-wrap: wrap; align-items: center; }
	.pan-navbar .navbar-nav .nav-item.dropdown > .nav-link { flex: 1 1 auto; }
	/* The caret button is the submenu toggle on mobile; hide the link's caret. */
	.pan-navbar .navbar-nav .nav-item.dropdown > .nav-link.dropdown-toggle::after { display: none; }
	.pan-navbar .navbar-nav .nav-item.dropdown > .dropdown-menu { flex: 0 0 100%; width: 100%; }
	.pan-navbar__subtoggle {
		flex: none;
		background: none;
		border: 0;
		color: var(--pan-cyan);
		font-size: 1rem;
		line-height: 1;
		padding: .4rem .75rem;
		cursor: pointer;
	}
	.pan-navbar__subtoggle .bi { transition: transform .2s ease; }
	.pan-navbar__subtoggle[aria-expanded="true"] .bi { transform: rotate(180deg); }
}

/* Desktop: open dropdowns on hover with no dead-zone gap (menu stays open
   while hovering the toggle or the menu itself). */
@media (min-width: 1200px) {
	.pan-navbar .nav-item.dropdown > .dropdown-menu {
		display: block;
		margin-top: 0;
		opacity: 0;
		visibility: hidden;
		transform: translateY(8px);
		transition: opacity .15s ease, transform .15s ease, visibility .15s;
		pointer-events: none;
	}
	.pan-navbar .nav-item.dropdown:hover > .dropdown-menu {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		pointer-events: auto;
	}
}

/* ---------- Hero ---------- */
.pan-hero {
	background: var(--pan-navy) center/cover no-repeat;
	/* Body copy color comes from the section's mode (--m-body) — light text on
	   dark mode, dark text on light mode. */
	padding: 7rem 0;
	position: relative;
	overflow: hidden;
}
.pan-hero--noimg {
	background: linear-gradient(120deg, var(--pan-navy) 0%, var(--pan-navy-3) 100%);
}
/* Background video (takes priority over the background image). */
.pan-hero__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
	pointer-events: none;
}
/* YouTube background: iframe can't object-fit, so oversize + center it to cover
   the hero (16:9 sized to whichever of width/height fills the box). */
.pan-hero__yt { overflow: hidden; container-type: size; }
.pan-hero__yt iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	/* Cover the CONTAINER (via container-query units) rather than the viewport, so
	   the video is far less zoomed inside the split panel. */
	transform: translate(-50%, -50%);
	width: 100cqw;
	height: 56.25cqw;
	min-width: 177.78cqh;
	min-height: 100cqh;
	border: 0;
	pointer-events: none;
}
/* Optional overlay over the background image or video. Color comes from the
   hero_overlay_color field via --hero-overlay; empty falls back to the dark gradient. */
.pan-hero--overlay::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: var(--hero-overlay, linear-gradient(90deg, rgba(11, 18, 30, .85) 0%, rgba(11, 18, 30, .45) 60%, rgba(11, 18, 30, .2) 100%));
	pointer-events: none;
}
.pan-hero > .container { position: relative; z-index: 2; }
.pan-hero__inner { max-width: 620px; }

/* Diagonal split: solid color panel on the left (holds the copy), background
   video clipped to the right. The diagonal mirrors the coverage section's cyan
   slant. Copy stays dark navy (the left panel is always a light color). */
.pan-hero--split { background: var(--hero-split-color, var(--pan-cyan)); }
.pan-hero--split .pan-hero__video {
	/* Confine the video to the right ~60% (where it's visible) instead of the full
	   width, so object-fit:cover crops far less and shows most of the frame. It
	   still underlaps the diagonal (clip-path is relative to this element) so there
	   are no gaps against the cyan panel. */
	left: 40%;
	right: auto;
	width: 60%;
	clip-path: polygon(10% 0, 100% 0, 100% 100%, 24% 100%);
}
/* Uploaded MP4 fills the panel (no gaps); the crop is anchored to the BOTTOM so
   the logo at the bottom of the frame is never cut off (top is cropped instead). */
.pan-hero--split video.pan-hero__video { object-fit: cover; object-position: 50% 100%; }
.pan-hero--split .pan-hero__inner { max-width: 540px; }
.pan-hero--split .pan-hero__heading,
.pan-hero--split .pan-hero__text { color: var(--pan-navy); }
@media (max-width: 991.98px) {
	/* The diagonal doesn't read on narrow screens — show the solid panel only. */
	.pan-hero--split .pan-hero__video { display: none; }
}
.pan-hero__lockup { max-height: 66px; width: auto; margin-bottom: 1.5rem; display: block; }
.pan-hero__lockup--text { display: flex; flex-direction: column; margin-bottom: 1.5rem; }
.pan-hero__lockup-sub {
	font-family: var(--pan-display);
	letter-spacing: .35em;
	font-size: .7rem;
	color: var(--pan-cyan);
	margin-top: .25rem;
}
.pan-hero__heading {
	font-size: clamp(2rem, 4.2vw, 3.2rem);
	font-weight: 700;
	margin-bottom: 1.25rem;
}
.pan-hero__text { font-size: 1.05rem; line-height: 1.7; margin-bottom: 1.75rem; max-width: 560px; }
.pan-hero__cta { font-size: .9rem; padding: .55rem 1.4rem; }

/* ---------- Intro ---------- */
.pan-intro__heading { font-size: clamp(1.8rem, 3vw, 2.6rem); margin-bottom: 1.25rem; }
.pan-intro__text p:last-child { margin-bottom: 0; }
.pan-intro__media img,
.pan-approach__media img,
.pan-approach__media video,
.pan-location__map img {
	width: 100%; height: 100%; object-fit: cover; border-radius: var(--pan-radius); display: block;
}
.pan-intro__media, .pan-approach__media { min-height: 320px; overflow: hidden; border-radius: var(--pan-radius); }
.pan-approach__video { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: var(--pan-radius); overflow: hidden; }
.pan-approach__video iframe, .pan-approach__video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- What We Do ---------- */
.pan-wwd__head { max-width: 820px; margin-bottom: 3rem; }
.pan-wwd__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
.pan-wwd__head .pan-wwd__heading:last-child { margin-bottom: 0; }
.pan-wwd__intro { margin: 0; color: var(--m-body); line-height: 1.7; }
/* Image cards — background photo + title; blurb & CTA reveal (slide up) on hover. */
.pan-wwd__card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	height: 100%;
	min-height: 360px;
	padding: 1.5rem;
	border-radius: var(--pan-radius);
	border: 1px solid #e9edf1;
	overflow: hidden;
	background: var(--pan-navy) center / cover no-repeat;
	color: var(--pan-navy);
	text-decoration: none;
	isolation: isolate;
}
/* Subtle white gradient at rest → full white overlay on hover (content reveals). */
.pan-wwd__card-scrim {
	position: absolute; inset: 0; z-index: 0;
	background: linear-gradient(to top, rgba(255, 255, 255, .95) 0%, rgba(255, 255, 255, .6) 45%, rgba(255, 255, 255, .1) 85%, rgba(255, 255, 255, 0) 100%);
	transition: background .4s ease;
}
.pan-wwd__card:hover .pan-wwd__card-scrim,
.pan-wwd__card:focus-visible .pan-wwd__card-scrim {
	background: rgba(255, 255, 255, .95);
}
.pan-wwd__card-body { position: relative; z-index: 1; }
.pan-wwd__card-title {
	display: block;
	margin: 0;
	font-family: var(--pan-display);
	font-weight: 700;
	font-size: 1.2rem;
	line-height: 1.2;
	letter-spacing: .01em;
	color: var(--pan-navy);
}
/* Collapsed by default; grid-rows 0fr→1fr animates the height open. */
.pan-wwd__card-reveal { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s ease; }
.pan-wwd__card-reveal-inner { overflow: hidden; opacity: 0; transform: translateY(12px); transition: opacity .4s ease, transform .4s ease; }
.pan-wwd__card:hover .pan-wwd__card-reveal,
.pan-wwd__card:focus-visible .pan-wwd__card-reveal { grid-template-rows: 1fr; }
.pan-wwd__card:hover .pan-wwd__card-reveal-inner,
.pan-wwd__card:focus-visible .pan-wwd__card-reveal-inner { opacity: 1; transform: translateY(0); }
.pan-wwd__card-text { display: block; padding-top: .85rem; color: var(--pan-navy); font-size: .95rem; line-height: 1.6; }
.pan-wwd__card-cta {
	display: inline-flex; align-items: center;
	margin-top: 1rem; padding: .6rem 1.4rem;
	border: 2px solid var(--pan-cyan); border-radius: var(--pan-radius);
	background: var(--pan-cyan);
	font-family: var(--pan-display); font-weight: 600; text-transform: uppercase; letter-spacing: .04em;
	font-size: .78rem; color: #06202e;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.pan-wwd__card-cta:hover { background: var(--pan-navy); border-color: var(--pan-navy); color: #fff; }
@media (prefers-reduced-motion: reduce) {
	.pan-wwd__card-reveal, .pan-wwd__card-reveal-inner, .pan-wwd__card-scrim { transition: none; }
}

/* ---------- Image grid ---------- */
.pan-grid__row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; padding: 20px; }
.pan-grid__cell { aspect-ratio: 1 / 1; overflow: hidden; }
.pan-grid__cell.pan-media-placeholder { min-height: 0; border-radius: 0; border-width: 1px 1px 1px 0; }
.pan-grid__cell img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 767.98px) { .pan-grid__row { grid-template-columns: repeat(2, 1fr); } }
/* Carousel variant (more than 5 images) — reuses the .pan-explore__* scroll track. */
/* Auto-scrolling image marquee (replaces the old arrow carousel). The track
   holds the images twice and shifts -50% for a seamless loop; the gap lives on
   each slide's margin so the halfway point lines up exactly. */
.pan-grid__marquee { overflow: hidden; padding: 20px 0; }
.pan-grid__marquee-track { display: flex; width: max-content; animation: pan-grid-marquee 60s linear infinite; }
.pan-grid__marquee:hover .pan-grid__marquee-track { animation-play-state: paused; }
.pan-grid__slide { flex: 0 0 auto; width: 260px; aspect-ratio: 1 / 1; overflow: hidden; margin-right: 20px; }
.pan-grid__slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
@keyframes pan-grid-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .pan-grid__marquee-track { animation: none; } }
@media (max-width: 767.98px) { .pan-grid__slide { width: 160px; } }

/* ---------- Location (light) ---------- */
.pan-location__heading { font-size: clamp(1.8rem, 3vw, 2.6rem); margin-bottom: 1.25rem; }
.pan-location__legend-img { max-width: 350px; width: 100%; height: auto; margin-top: 1.5rem; display: block; }
.pan-location__legend { margin: 1.75rem 0 0; padding-left: 0; }
.pan-legend-item { display: flex; align-items: center; gap: .75rem; padding: .6rem 1rem; background: #fff; border: 1px solid #e9edf1; border-radius: var(--pan-radius); box-shadow: 0 6px 24px rgba(15, 26, 43, .06); margin-bottom: .6rem; font-weight: 600; color: var(--pan-text-dark); }
.pan-legend-dot { width: 14px; height: 14px; border-radius: 50%; flex: none; }
.pan-legend-marker { height: 18px; width: auto; flex: none; display: block; }
.pan-legend-item--primary .pan-legend-dot { background: var(--pan-cyan); }
.pan-legend-item--partner .pan-legend-dot { background: #fff; border: 2px solid var(--pan-cyan); }
.pan-location__map { min-height: 340px; }
.pan-location__map img { min-height: 340px; object-fit: contain; }

/* ---------- Advantage ---------- */
.pan-advantage__head { margin-bottom: 3rem; }
.pan-advantage__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
.pan-advantage__intro { max-width: 720px; }
.pan-advantage__box {
	background: #fff;
	border: 1px solid #e9edf1;
	border-left: 4px solid var(--pan-cyan);
	border-radius: var(--pan-radius);
	padding: 1.6rem 1.8rem;
	box-shadow: 0 6px 24px rgba(15, 26, 43, .06);
}
.pan-advantage__title { font-size: 1.3rem; margin-bottom: .6rem; }
.pan-advantage__text { font-size: .95rem; }

/* ---------- Approach ---------- */
.pan-approach__heading { font-size: clamp(1.8rem, 3vw, 2.6rem); margin-bottom: 1.25rem; }
.pan-approach__text p:last-child { margin-bottom: 0; }

/* ---------- Services carousel ---------- */
/* Background comes from the section's own mode/ACF setting (pan-mode-* + pan_bg_attr). */
.pan-services__heading { font-size: clamp(2rem, 3.4vw, 2.9rem); margin-bottom: 3rem; }
.pan-services__carousel { padding: 0 3rem 3rem; }
.pan-service-card {
	background: #fff;
	border-radius: var(--pan-radius);
	padding: 2rem 1.5rem;
	text-align: center;
	box-shadow: 0 6px 24px rgba(15, 26, 43, .06);
	border: 1px solid #e9edf1;
}
.pan-service-card__icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 78px; height: 78px; border-radius: 50%;
	background: var(--pan-navy); color: #fff; font-size: 2rem; margin-bottom: 1.25rem;
}
.pan-service-card__icon-img { width: 42px; height: 42px; object-fit: contain; display: block; }
/* Slider item wrapper (shares the .pan-explore__* scroll-track mechanism). */
.pan-services__citem { flex: 0 0 300px; width: 300px; }
@media (max-width: 767.98px) { .pan-services__citem { flex-basis: 82%; width: 82%; } }
.pan-service-card__title { font-size: 1.25rem; color: var(--pan-text-dark); margin-bottom: .85rem; }
.pan-service-card__text { font-size: .92rem; color: var(--pan-gray); margin-bottom: 1rem; }
.pan-services__control { width: 2.5rem; height: 100%; top: 0; opacity: 1; color: var(--pan-navy); font-size: 1.6rem; }
.pan-services__control:hover { color: var(--pan-cyan); }
.pan-services__dots { position: static; margin-top: 1.5rem; }
.pan-services__dots [data-bs-target] { width: 10px; height: 10px; border-radius: 50%; background: #c3ccd6; border: 0; opacity: 1; }
.pan-services__dots .active { background: var(--pan-navy); }

/* ---------- Industries ---------- */
.pan-industries__head { margin-bottom: 3rem; }
.pan-industries__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
.pan-industries__intro { max-width: 760px; }
.pan-industries__list { margin-inline: auto; }
.pan-industries__item {
	display: flex; align-items: center; gap: .75rem;
	height: 100%;
	background: #fff;
	border: 1px solid #e9edf1;
	color: var(--pan-navy);
	font-family: var(--pan-display);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .02em;
	font-size: 1.05rem;
	text-align: left;
	padding: .85rem 1.2rem;
	border-radius: var(--pan-radius);
	text-decoration: none;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.pan-industries__item-badge {
	flex: none;
	display: inline-flex; align-items: center; justify-content: center;
	width: 42px; height: 42px;
	border-radius: 50%;
	background: var(--pan-cyan);
	transition: background-color .15s ease;
}
.pan-industries__item:hover .pan-industries__item-badge { background: #fff; }
.pan-industries__item-icon { color: #fff; font-size: 1.3rem; line-height: 1; transition: color .15s ease; }
.pan-industries__item:hover .pan-industries__item-icon { color: var(--pan-navy); }
/* Custom icon rendered as a mask so it recolors (white → navy on hover). */
.pan-industries__item-icon-img {
	width: 22px; height: 22px;
	background-color: #fff;
	-webkit-mask: center / contain no-repeat;
	mask: center / contain no-repeat;
	transition: background-color .15s ease;
}
.pan-industries__item:hover .pan-industries__item-icon-img { background-color: var(--pan-navy); }
.pan-industries__item-label { flex: 1 1 auto; margin: 0; font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit; }
.pan-industries__item-arrow { color: var(--pan-cyan); flex: none; transition: transform .15s ease, color .15s ease; }
.pan-industries__item:hover { background: var(--pan-navy); color: #fff; border-color: var(--pan-navy); }
/* Label is an <h3>, so the mode heading rule pins it navy — force white on hover. */
.pan-industries__item:hover .pan-industries__item-label { color: #fff; }
.pan-industries__item:hover .pan-industries__item-arrow { color: #fff; transform: translateX(4px); }
/* Badge + label vertically centered; rows stay equal-height. */
.pan-industries__item { align-items: center; }

/* Two global CTAs centered beneath the list */
.pan-industries__cta { margin-top: 2.5rem; }

/* ---------- Portals ---------- */
.pan-portals__heading { font-size: clamp(1.8rem, 3vw, 2.4rem); margin-bottom: 1rem; }
.pan-portals__logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 1rem 2.5rem; }
.pan-portals__logo { display: flex; align-items: center; justify-content: center; min-height: 60px; }
.pan-portals__logo img { max-width: 85px; height: auto; filter: grayscale(1) brightness(.5); opacity: 1; transition: filter .15s ease; }
.pan-portals__logo img:hover { filter: none; }
.pan-portals__name { font-family: var(--pan-display); font-weight: 700; font-size: 1.4rem; color: var(--pan-cyan); }

/* ---------- Partner CTA band ---------- */
.pan-partner { text-align: center; }
.pan-partner__inner { max-width: 800px; }
.pan-partner__heading { font-size: clamp(1.9rem, 3.4vw, 2.9rem); margin-bottom: 1.1rem; }
.pan-partner__text { font-size: 1.05rem; margin-bottom: 1.75rem; }

/* ---------- Footer (single dark section) ---------- */
.pan-footer { background: var(--m-bg); color: var(--m-body); padding: 3.5rem 0 1.75rem; }

/* Row of 3 columns: logo / links / contact */
.pan-footer__cols { margin-bottom: 1rem; }
.pan-footer__brand { display: inline-block; }
.pan-footer__brand img { max-width: 250px; height: auto; width: auto; }
.pan-footer__heading { display: block; font-family: var(--pan-display); font-weight: 700; line-height: 1.1; color: var(--m-heading); font-size: 1.15rem; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 1.1rem; }
.pan-footer__menu { margin: 0; }
.pan-footer__menu li { margin-bottom: .6rem; }
.pan-footer__menu a { color: var(--m-link); text-decoration: none; }
.pan-footer__menu a:hover { color: var(--pan-cyan); }
.pan-footer__address { font-style: normal; font-size: .95rem; line-height: 1.8; margin-bottom: 1.1rem; color: var(--m-body); }
.pan-footer__address a { color: var(--m-link); text-decoration: none; }
.pan-footer__address a:hover { color: var(--pan-cyan); }
.pan-footer__social { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0; padding: 0; }
.pan-footer__social li { line-height: 0; }
.pan-footer__social a {
	display: inline-flex; align-items: center; justify-content: center;
	width: 40px; height: 40px; border-radius: 50%;
	background: var(--pan-cyan); border: 0;
	color: #fff; font-size: 1.1rem; line-height: 1; text-decoration: none;
	transition: background-color .15s ease, color .15s ease;
}
.pan-footer__social a i { line-height: 1; display: block; }
.pan-footer__social a:hover { background: var(--pan-secondary); color: #fff; }

/* Full-width text below the columns */
.pan-footer__tagline { font-size: .8rem; line-height: 1.7; margin: 1.5rem 0 0; padding-top: 1.5rem; border-top: 1px solid rgba(0, 0, 0, .1); }
.pan-footer__badge { width: 150px; height: auto; margin-top: 1.5rem; }
.pan-footer__badge-link { display: inline-block; margin-top: 1.5rem; }
.pan-footer__badge-link .pan-footer__badge { margin-top: 0; }
.pan-footer__compliance { font-size: .8rem; line-height: 1.7; color: var(--m-body); margin-top: 1.25rem; }
.pan-footer__compliance p { margin-bottom: .75rem; }
.pan-footer__compliance a { color: var(--m-link); text-decoration: underline; }
.pan-footer__compliance a:hover { color: var(--pan-cyan); }

/* Legal links + copyright as the last lines of the section */
.pan-footer__bottom { margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid rgba(0, 0, 0, .1); font-size: .85rem; }
.pan-footer__legal { list-style: none; padding: 0; margin: 0 0 .5rem; }
.pan-footer__legal li { display: inline-block; margin-right: 1.25rem; }
.pan-footer__legal a { color: var(--m-link); text-decoration: none; }
.pan-footer__legal a:hover { color: var(--pan-cyan); }
.pan-footer__copyright { color: var(--m-body); }
.pan-footer__credit a { color: var(--m-link); text-decoration: underline; }
.pan-footer__credit a:hover { color: var(--pan-cyan); }

/* ---------- Sticky header (top-bar + navbar) ---------- */
.pan-sticky {
	position: sticky;
	top: 0;
	z-index: 1030;
	box-shadow: 0 2px 14px rgba(0, 0, 0, .25);
}
.admin-bar .pan-sticky { top: 32px; }
@media (max-width: 782px) { .admin-bar .pan-sticky { top: 46px; } }
/* Keep in-page anchor targets & keyboard-focused elements clear of the sticky
   header so it never overlaps the item in focus (WCAG 2.4.11 focus-not-obscured). */
html { scroll-padding-top: 130px; }
@media (max-width: 1199.98px) { html { scroll-padding-top: 110px; } }

/* ---------- Mobile sticky phone bar (below nav) ---------- */
.pan-mobile-phone {
	display: block;
	background: var(--pan-navy);
	color: #fff;
	text-align: center;
	font-family: var(--pan-display);
	font-weight: 700;
	font-size: 1.1rem;
	letter-spacing: .01em;
	padding: .6rem 1rem;
	text-decoration: none;
}
.pan-mobile-phone:hover { background: #fff; color: var(--pan-navy); }

/* ---------- Top sub-navigation ---------- */
/* No border-bottom: the white "current" tab bleeds straight into the nav below. */
.pan-topbar {
	background: var(--pan-navy-deep);
}
.pan-topbar__menu {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;   /* tabs fill the full row height so they sit flush against the navbar */
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
}
.pan-topbar__menu li { display: flex; }
.pan-topbar__menu a {
	display: flex;
	align-items: center;
	color: #fff;
	text-decoration: none;
	font-family: var(--pan-display);
	font-weight: 700;
	text-transform: none;
	letter-spacing: .01em;
	font-size: 1.05rem;
	line-height: 1;
	padding: .6rem 1.2rem;
	white-space: nowrap;
}
.pan-topbar__menu li:first-child a { padding-left: 0; }
.pan-topbar__menu a:hover { color: var(--pan-cyan); }
/* "Current" tab: white bg + dark-blue text; bleeds into the white nav below. */
.pan-topbar__menu li.pan-topbar__current a { background: #fff; color: var(--pan-secondary); }
.pan-topbar__menu li.pan-topbar__current a:hover { background: #fff; color: var(--pan-secondary); }
@media (max-width: 575.98px) {
	.pan-topbar__menu { flex-wrap: nowrap; justify-content: flex-start; }
	.pan-topbar__menu li:first-child a { padding-left: 0; }
	.pan-topbar__menu a { padding: .5rem .5rem; font-size: .72rem; letter-spacing: 0; }
}

/* ---------- Hero dual CTAs ---------- */
.pan-hero__ctas { display: flex; flex-wrap: wrap; gap: .75rem; }
.pan-hero__ctas .pan-btn { padding: .6rem 1.4rem; }

/* ---------- Responsive tweaks ---------- */
@media (max-width: 991.98px) {
	.pan-home > section { padding: 3.5rem 0; }
	.pan-hero { padding: 4.5rem 0; }
	.pan-services__carousel { padding: 0 0 3rem; }
	.pan-services__control { display: none; }
}

/* ============================================================
   Single Client (Industry) template — template-parts/client/*
   ============================================================ */

/* Section rhythm (mirrors .pan-home). */
.pan-client > section { padding: 5rem 0; }

/* ---------- 1 · Header (responsive picture background) ---------- */
.pan-chero {
	background: var(--pan-navy) center/cover no-repeat;
	padding: 7rem 0;
	position: relative;
	overflow: hidden;
}
.pan-chero--noimg { background: linear-gradient(120deg, var(--pan-navy) 0%, var(--pan-navy-3) 100%); }
.pan-chero__bg { position: absolute; inset: 0; z-index: 0; }
.pan-chero__bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pan-chero--overlay::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: var(--hero-overlay, linear-gradient(90deg, rgba(11, 18, 30, .85) 0%, rgba(11, 18, 30, .45) 60%, rgba(11, 18, 30, .2) 100%));
	pointer-events: none;
}
.pan-chero > .container { position: relative; z-index: 2; }
.pan-chero__inner { max-width: 75%; }
.pan-chero__heading { font-size: clamp(2rem, 4.2vw, 3.2rem); font-weight: 700; margin-bottom: 1.25rem; }
.pan-chero__text { font-size: 1.05rem; line-height: 1.7; margin-bottom: 1.75rem; }
.pan-chero__ctas { display: flex; flex-wrap: wrap; gap: .75rem; }
.pan-chero__ctas .pan-btn { padding: .6rem 1.4rem; }

/* ---------- 4 · Services We Offer ---------- */
.pan-cservices__head { margin-bottom: 2.5rem; text-align: center; }
.pan-cservices__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
.pan-cservices__subheader { max-width: 760px; font-family: var(--pan-display); font-weight: 600; font-size: clamp(1.15rem, 1.6vw, 1.4rem); line-height: 1.4; color: var(--m-heading); margin-bottom: 1rem; }
.pan-cservices__intro { max-width: 720px; }
.pan-cservices__card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1rem;
	height: 100%;
	padding: 1.75rem;
	border-radius: var(--pan-radius);
	border: 1px solid transparent;
}
.pan-mode-dark .pan-cservices__card { background: #fff; border-color: #e9edf1; box-shadow: 0 6px 24px rgba(15, 26, 43, .06); }
.pan-mode-light .pan-cservices__card { background: #fff; border-color: #e9edf1; box-shadow: 0 6px 24px rgba(15, 26, 43, .06); }
.pan-cservices__top { display: flex; align-items: center; gap: .75rem; }
.pan-cservices__icon {
	flex: none;
	display: inline-flex; align-items: center; justify-content: center;
	color: var(--pan-cyan); font-size: 2.6rem; line-height: 1;
}
.pan-cservices__icon-img { width: 52px; height: 52px; object-fit: contain; display: block; }
.pan-cservices__name { font-family: var(--pan-display); font-weight: 700; color: var(--m-heading); font-size: 1.25rem; line-height: 1.2; margin: 0; }
.pan-cservices__text { font-size: .95rem; }
.pan-cservices__text p:last-child { margin-bottom: 0; }
.pan-cservices__btn { margin-top: auto; }

/* ---------- 8 · Why Choose Us ---------- */
.pan-cwhy__heading { font-size: clamp(2rem, 3.6vw, 3rem); margin-bottom: 1.25rem; }
.pan-cwhy__text { margin-bottom: 1.75rem; }
.pan-cwhy__text p:last-child { margin-bottom: 0; }
.pan-cwhy__ctas { margin-top: .5rem; }
.pan-cwhy__ctas .pan-btn { padding: .6rem 1.4rem; }
.pan-cwhy__list { display: flex; flex-direction: column; gap: 1rem; }
/* List items are always dark-blue with light copy, regardless of section mode. */
.pan-cwhy__item {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.25rem 1.5rem;
	border-radius: var(--pan-radius);
	background: var(--pan-navy);
	border: 1px solid var(--pan-navy-line);
}
.pan-cwhy__check {
	flex: none;
	color: var(--pan-cyan);
	font-size: 1.4rem;
	line-height: 1.2;
}
.pan-cwhy__item .pan-cwhy__item-title { font-size: 1.15rem; margin-bottom: .3rem; color: #fff; }
.pan-cwhy__item .pan-cwhy__item-text { font-size: .95rem; color: rgba(255, 255, 255, .78); }

/* ---------- 5 · Benefits (centered head + box grid) ---------- */
.pan-cbenefits__head { max-width: 760px; margin-bottom: 3rem; }
.pan-cbenefits__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
.pan-cbenefits__box {
	padding: 1.8rem;
	border-radius: var(--pan-radius);
	border: 1px solid transparent;
	border-top: 3px solid var(--pan-cyan);
}
.pan-mode-dark .pan-cbenefits__box { background: #fff; border-color: #e9edf1; border-top-color: var(--pan-cyan); box-shadow: 0 6px 24px rgba(15, 26, 43, .06); }
.pan-mode-light .pan-cbenefits__box { background: #fff; border-color: #e9edf1; border-top-color: var(--pan-cyan); box-shadow: 0 6px 24px rgba(15, 26, 43, .06); }
.pan-cbenefits__title { font-size: 1.3rem; margin-bottom: .75rem; }
.pan-cbenefits__text { font-size: .95rem; }
/* Explore / services-grid intro body copy: dark navy (except white over a dark overlay). */
.pan-explore-core .pan-cbenefits__intro { color: var(--pan-navy); }

/* ---------- Client responsive ---------- */
@media (max-width: 991.98px) {
	.pan-client > section { padding: 3.5rem 0; }
	.pan-chero { padding: 4.5rem 0; }
	.pan-chero__inner { max-width: 100%; }
	/* Stacked on mobile: let the image box hug the image (no tall min-height gap). */
	.pan-intro__media, .pan-approach__media { min-height: 0; }
	.pan-intro__media img, .pan-approach__media img { height: auto; }
}

/* ============================================================
   Single Service template — template-parts/service/*
   ============================================================ */

/* ---------- 3 · Types of Services ---------- */
.pan-stypes__head { max-width: 760px; margin-bottom: 3rem; }
.pan-stypes__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
/* Dark sections (brand-blue bg): each type sits in a white container. */
.pan-mode-dark .pan-stypes__card { background: #fff; border-radius: var(--pan-radius); padding: 1.5rem; box-shadow: 0 6px 24px rgba(15, 26, 43, .06); }
.pan-stypes__media { border-radius: var(--pan-radius); overflow: hidden; aspect-ratio: 16 / 10; margin-bottom: 1.25rem; }
.pan-stypes__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pan-stypes__title { font-size: 1.3rem; margin-bottom: .75rem; }
.pan-stypes__text { font-size: .95rem; }
.pan-stypes__text p:last-child { margin-bottom: 0; }

/* ---------- 4 · Why (dark boxes + check) ---------- */
.pan-swhy__head { max-width: 820px; margin-bottom: 3rem; }
.pan-swhy__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
.pan-swhy__box { padding: 1.8rem; border-radius: var(--pan-radius); border: 1px solid transparent; }
.pan-mode-dark .pan-swhy__box { background: #fff; border-color: #e9edf1; box-shadow: 0 6px 24px rgba(15, 26, 43, .06); }
.pan-mode-light .pan-swhy__box { background: #fff; border-color: #e9edf1; box-shadow: 0 6px 24px rgba(15, 26, 43, .06); }
.pan-swhy__title { font-size: 1.3rem; margin-bottom: .75rem; display: flex; align-items: center; gap: .6rem; }
.pan-swhy__check { color: var(--pan-cyan); font-size: 1.2rem; flex: none; }
.pan-swhy__text { font-size: .95rem; }
.pan-swhy__text p:last-child { margin-bottom: 0; }

/* ---------- 5 · Process (numbered step cards) ---------- */
.pan-sprocess__head { max-width: 760px; margin-bottom: 3rem; }
.pan-sprocess__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
.pan-sprocess__media { position: relative; margin-bottom: 1.75rem; }
.pan-sprocess__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--pan-radius); display: block; }
.pan-sprocess__num { position: absolute; left: 1.25rem; bottom: -1rem; z-index: 2; }
.pan-sprocess__num--auto {
	width: 52px; height: 52px; border-radius: 50%;
	background: var(--pan-cyan); color: #06202e;
	display: flex; align-items: center; justify-content: center;
	font-family: var(--pan-display); font-weight: 700; font-size: 1.4rem;
	box-shadow: 0 4px 12px rgba(15, 26, 43, .2);
}
.pan-sprocess__num--img { width: 52px; height: 52px; object-fit: contain; }
/* No image: the number sits static + left-aligned above the heading (not overlaid). */
.pan-sprocess__num--inline { position: static; margin-bottom: 1rem; }
/* Dark mode = light-blue bg: white number badge so it doesn't bleed into the background. */
.pan-sprocess.pan-mode-dark .pan-sprocess__num--auto { background: #fff; }
.pan-sprocess__title { font-size: 1.3rem; margin-bottom: .6rem; }
.pan-sprocess__text { font-size: .95rem; }
.pan-sprocess__text p:last-child { margin-bottom: 0; }

/* ---------- 9 · Explore More Services (scroll-snap track, one at a time) ---------- */
.pan-explore__heading { font-size: clamp(1.9rem, 3.4vw, 2.8rem); margin-bottom: 3rem; }
.pan-explore__wrap { display: flex; align-items: center; gap: .5rem; }
.pan-explore__viewport { flex: 1 1 auto; overflow: hidden; padding: .25rem 0 1rem; }
.pan-explore__track {
	display: flex;
	gap: 1.5rem;
}
.pan-explore__item {
	flex: 0 0 190px;
	width: 190px;
	display: flex; flex-direction: column; align-items: center; text-align: center;
	gap: .9rem; text-decoration: none;
}
.pan-explore__icon {
	display: flex; align-items: center; justify-content: center;
	min-height: 104px;
	color: var(--pan-cyan);
	font-size: 4rem; line-height: 1;
}
.pan-explore__icon img { width: 104px; height: 104px; object-fit: contain; }
.pan-explore__name { font-family: var(--pan-display); font-weight: 700; color: var(--m-heading); font-size: .95rem; line-height: 1.2; }
.pan-explore__nav {
	flex: none;
	width: 2.75rem; height: 2.75rem;
	border-radius: 50%;
	border: 1px solid #d4dae2;
	background: #fff;
	color: var(--pan-navy);
	display: flex; align-items: center; justify-content: center;
	font-size: 1.3rem; cursor: pointer;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.pan-explore__nav:hover { background: var(--pan-navy); color: #fff; border-color: var(--pan-navy); }
/* Static layout (≤6 tiles): no arrows/scroll — center the tiles and let them wrap. */
.pan-explore__static { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.5rem; padding: .25rem 0 1rem; }
@media (max-width: 575.98px) {
	.pan-explore__item { flex: 0 0 45%; width: 45%; }
}

/* ---------- 10 · FAQs (accordion) ---------- */
.pan-faqs__heading { font-size: clamp(1.9rem, 3.4vw, 2.8rem); margin-bottom: 2rem; }
.pan-faqs__list { display: flex; flex-direction: column; gap: 1rem; }
.pan-faq { border: 1px solid transparent; border-radius: var(--pan-radius); overflow: hidden; }
.pan-mode-light .pan-faq { background: #fff; border-color: #e6eaef; box-shadow: 0 6px 20px rgba(15, 26, 43, .05); }
.pan-mode-dark .pan-faq { background: #fff; border-color: #e6eaef; box-shadow: 0 6px 20px rgba(15, 26, 43, .05); }
.pan-faq__q {
	display: flex; align-items: center; gap: .75rem; width: 100%; text-align: left;
	background: none; border: 0; padding: 1.1rem 1.4rem;
	font-family: var(--pan-display); font-weight: 700; font-size: 1.1rem;
	color: var(--m-heading); cursor: pointer;
}
.pan-faq__chev { color: var(--pan-cyan); font-size: 1rem; flex: none; transition: transform .2s ease; }
.pan-faq__q[aria-expanded="true"] .pan-faq__chev { transform: rotate(180deg); }
.pan-faq__a { padding: 0 1.4rem 1.25rem 3.15rem; }
.pan-faq__a p:last-child { margin-bottom: 0; }

@media (max-width: 991.98px) {
	.pan-stypes__media img, .pan-sprocess__media img { aspect-ratio: 16 / 9; }
}

/* ---------- Rich-text lists: drop the Underscores 3em left margin ---------- */
.pan-intro__text ul, .pan-intro__text ol,
.pan-approach__text ul, .pan-approach__text ol,
.pan-cwhy__text ul, .pan-cwhy__text ol,
.pan-stypes__text ul, .pan-stypes__text ol,
.pan-swhy__text ul, .pan-swhy__text ol,
.pan-sprocess__text ul, .pan-sprocess__text ol,
.pan-faq__a ul, .pan-faq__a ol {
	margin-left: 0;
	padding-left: 1.25rem;
}

/* ============================================================
   Core Service page template — template-parts/core/*
   ============================================================ */

/* ---------- 1 · Hero subheader (larger, bolder line above the body copy) ---------- */
.pan-chero__subheader {
	font-size: clamp(1.3rem, 2vw, 1.65rem);
	font-weight: 600;
	line-height: 1.4;
	font-family: var(--pan-display);
	color: var(--pan-navy-deep);
	margin-bottom: 1rem;
}
.pan-mode-dark .pan-chero__subheader { color: #fff; }

/* ---------- 3 · Process (CTAs beneath the card grid) ---------- */
.pan-cservices__ctas { margin-top: 3rem; }
.pan-cservices__ctas .pan-btn { padding: .6rem 1.4rem; }

/* ---------- 5 · National Coverage (global) ---------- */
.pan-coverage { position: relative; overflow: hidden; background: #f4f5f7; }
.pan-coverage .container { position: relative; z-index: 2; }
/* Full-bleed cyan diagonal behind the map, mirroring the reference art. */
.pan-coverage__decor {
	position: absolute;
	top: 0; bottom: 0; right: 0;
	width: 46%;
	z-index: 1;
	background: var(--pan-cyan);
	clip-path: polygon(14% 0, 100% 0, 100% 100%, 34% 100%);
	pointer-events: none;
}
.pan-coverage__stats {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 2.25rem 1.5rem;
	max-width: 460px;
	margin-bottom: 2.5rem;
}
.pan-coverage__num {
	display: block;
	font-family: var(--pan-display);
	font-weight: 700;
	font-size: clamp(2.4rem, 4vw, 3.4rem);
	line-height: 1;
	color: var(--pan-navy);
}
.pan-coverage__label { display: block; margin-top: .5rem; color: #6D7175; font-size: .98rem; }
.pan-coverage__ctas .pan-btn { padding: .6rem 1.4rem; }
.pan-coverage__map { position: relative; }
.pan-coverage__map img { width: 100%; height: auto; display: block; }
@media (max-width: 991.98px) {
	.pan-coverage__decor { display: none; }
	.pan-coverage__stats { max-width: none; }
}

/* ---------- 6 · Explore Additional Services (linked box grid) ---------- */
/* With an overlay in DARK mode, the heading/intro sit over the darkened image,
   so make them white for legibility. In light mode they keep the normal navy
   text. The white cards below are unchanged. */
.pan-explore-core--overlay.pan-mode-dark .pan-cbenefits__heading,
.pan-explore-core--overlay.pan-mode-dark .pan-cbenefits__intro { color: #fff; }
.pan-explore-core__box {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	transition: transform .18s ease, box-shadow .18s ease;
}
.pan-explore-core__box:hover { transform: translateY(-4px); }
.pan-mode-light .pan-explore-core__box:hover { box-shadow: 0 14px 34px rgba(15, 26, 43, .12); }
.pan-explore-core__box .pan-cbenefits__title { color: var(--m-heading); }
.pan-explore-core__more {
	margin-top: auto;
	padding-top: 1rem;
	color: var(--pan-navy);
	font-family: var(--pan-display);
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	transition: gap .18s ease, color .18s ease;
}
/* Navy at rest for contrast on white; cyan on hover. */
.pan-explore-core__box:hover .pan-explore-core__more { gap: .65rem; color: var(--pan-cyan); }

/* ---------- 7 · Related Resources ---------- */
.pan-resources__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1.25rem; }
.pan-resources__subheader { font-family: var(--pan-display); font-weight: 600; font-size: clamp(1.15rem, 1.6vw, 1.4rem); line-height: 1.4; color: var(--m-heading); margin-top: -.5rem; margin-bottom: 1.25rem; }
.pan-resources__text { margin-bottom: 1.75rem; }
.pan-resources__text p:last-child { margin-bottom: 0; }
.pan-resources__ctas .pan-btn { padding: .6rem 1.4rem; }
.pan-resources__card {
	border-radius: var(--pan-radius);
	padding: 2rem;
	background: #f4f5f7;
	border: 1px solid #e9edf1;
}
.pan-mode-dark .pan-resources__card { background: #fff; border-color: #e9edf1; box-shadow: 0 6px 24px rgba(15, 26, 43, .06); }
.pan-resources__card-heading {
	font-size: 1.3rem;
	margin-bottom: 1rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(15, 26, 43, .12);
}
.pan-mode-dark .pan-resources__card-heading { border-bottom-color: rgba(15, 26, 43, .12); }
.pan-resources__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .9rem; }
.pan-resources__item { display: flex; align-items: flex-start; gap: .6rem; }
.pan-resources__chevron { color: var(--pan-cyan); font-size: .95rem; line-height: 1.5; flex: none; }
.pan-resources__item a { color: var(--m-heading); text-decoration: none; font-weight: 600; }
.pan-resources__item a:hover { color: var(--pan-cyan); text-decoration: underline; }

/* ============================================================
   Industries Landing page template — template-parts/industries/*
   ============================================================ */

/* ---------- 3 · Industries Grid (image-topped cards) ---------- */
.pan-ilgrid__head { max-width: 760px; margin-bottom: 3rem; }
.pan-ilgrid__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
.pan-ilgrid__intro { max-width: 720px; }
.pan-ilcard {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border-radius: var(--pan-radius);
	border: 1px solid transparent;
	text-decoration: none;
	transition: transform .18s ease, box-shadow .18s ease;
}
.pan-mode-dark .pan-ilcard { background: #fff; border-color: #e9edf1; box-shadow: 0 6px 24px rgba(15, 26, 43, .06); }
.pan-mode-light .pan-ilcard { background: #fff; border-color: #e9edf1; box-shadow: 0 6px 24px rgba(15, 26, 43, .06); }
.pan-ilcard:hover { transform: translateY(-4px); }
.pan-mode-light .pan-ilcard:hover { box-shadow: 0 14px 34px rgba(15, 26, 43, .12); }
.pan-ilcard__media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; }
.pan-ilcard__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.pan-ilcard:hover .pan-ilcard__media img { transform: scale(1.04); }
.pan-ilcard__media.pan-media-placeholder { border: 0; border-radius: 0; min-height: 0; }
.pan-ilcard__body { display: flex; flex-direction: column; flex: 1 1 auto; padding: 1.6rem; }
.pan-ilcard__title { font-size: 1.3rem; margin-bottom: .6rem; color: var(--m-heading); }
.pan-ilcard__text { font-size: .95rem; margin-bottom: 1rem; color: var(--m-body); }
.pan-ilcard__more {
	margin-top: auto;
	color: var(--pan-navy);
	font-family: var(--pan-display);
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	transition: gap .18s ease, color .18s ease;
}
.pan-ilcard:hover .pan-ilcard__more { gap: .65rem; }
/* Navy at rest for contrast on white; the "more" link lightens to cyan on hover,
   while body text deepens to navy as the whole card reads as one target. */
.pan-ilcard:hover .pan-ilcard__text { color: var(--pan-navy); }
.pan-ilcard:hover .pan-ilcard__more { color: var(--pan-cyan); }
/* Text-only link cards (no image/media) — center the body + light-blue top accent. */
.pan-ilcard--nomedia { justify-content: center; }
.pan-mode-light .pan-ilcard--nomedia,
.pan-mode-dark .pan-ilcard--nomedia { border-top: 3px solid var(--pan-cyan); }
.pan-ilcard--nomedia .pan-ilcard__body { padding: 2.2rem 1.6rem; }
/* "See All Guides" button above the Recent Guides grid. */
.pan-insights-recent__action { margin-bottom: 2.5rem; }

/* ============================================================
   Single Blog Post ("Guides") — single.php / template-parts/post/*
   ============================================================ */

/* ---------- Breadcrumbs (in the dark hero) ---------- */
.pan-breadcrumbs { margin-bottom: 1.1rem; }
.pan-breadcrumbs__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .3rem .1rem;
	font-family: var(--pan-display);
	font-size: .9rem;
	font-weight: 600;
}
.pan-breadcrumbs__item { display: inline-flex; align-items: center; }
.pan-breadcrumbs__item:not(:last-child)::after {
	content: "\203A"; /* › */
	margin: 0 .55rem;
}
.pan-breadcrumbs__link { text-decoration: none; }
.pan-breadcrumbs__link:hover { color: var(--pan-cyan); }
/* Mode-aware breadcrumb colors (dark text on the light hero, light on dark). */
.pan-mode-light .pan-breadcrumbs__link { color: var(--pan-navy); }
.pan-mode-light .pan-breadcrumbs__item--current { color: var(--pan-navy); }
.pan-mode-light .pan-breadcrumbs__item:not(:last-child)::after { color: rgba(27, 40, 63, .45); }
.pan-mode-dark .pan-breadcrumbs__link { color: rgba(255, 255, 255, .75); }
.pan-mode-dark .pan-breadcrumbs__item--current { color: #fff; }
.pan-mode-dark .pan-breadcrumbs__item:not(:last-child)::after { color: rgba(255, 255, 255, .5); }

/* ---------- Post hero (no CTAs; give the title room) ---------- */
.pan-post-hero__title { margin-bottom: 0; }
/* Light fallback background when the post has no featured image. */
.pan-post-hero.pan-chero--noimg { background: #f4f5f7; }

/* ---------- Post meta (date + categories, above the content) ---------- */
.pan-post-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem 1.75rem;
	margin-bottom: 1.75rem;
	font-family: var(--pan-display);
	font-weight: 600;
	color: var(--pan-navy);
}
.pan-post-meta__item { display: inline-flex; align-items: center; gap: .5rem; }
.pan-post-meta__item i { color: var(--pan-cyan); font-size: 1.1rem; line-height: 1; }

/* ---------- Post content (full container width) ---------- */
.pan-post__body { max-width: none; }
.pan-post__body > *:first-child { margin-top: 0; }
.pan-post__body > *:last-child { margin-bottom: 0; }
.pan-post__body p { margin-bottom: 1.4rem; line-height: 1.8; }
.pan-post__body h2 { font-size: clamp(1.6rem, 2.6vw, 2.1rem); margin: 2.5rem 0 1rem; }
.pan-post__body h3 { font-size: clamp(1.3rem, 2vw, 1.6rem); margin: 2rem 0 .85rem; }
.pan-post__body h4 { font-size: 1.2rem; margin: 1.75rem 0 .75rem; }
.pan-post__body ul, .pan-post__body ol { margin: 0 0 1.4rem; padding-left: 1.35rem; }
.pan-post__body li { margin-bottom: .5rem; line-height: 1.7; }
.pan-post__body a { color: var(--pan-cyan-dark); text-decoration: underline; }
.pan-post__body a:hover { color: var(--pan-navy); }
.pan-post__body img { max-width: 100%; height: auto; border-radius: var(--pan-radius); margin: 1rem 0 1.75rem; }
.pan-post__body figure { margin: 1rem 0 1.75rem; }
.pan-post__body figure img { margin: 0; }
.pan-post__body figcaption { font-size: .9rem; color: #6D7175; margin-top: .5rem; text-align: center; }
/* WordPress image alignments — let text wrap beside floated images. */
.pan-post__body::after { content: ""; display: table; clear: both; }
/* The base stylesheet sets clear:both on all headings, which would drop a
   heading below a floated image instead of letting it wrap beside it. */
.pan-post__body h1, .pan-post__body h2, .pan-post__body h3,
.pan-post__body h4, .pan-post__body h5, .pan-post__body h6 { clear: none; }
.pan-post__body .alignright { float: right; max-width: 50%; margin: .5rem 0 1.25rem 2rem; }
.pan-post__body .alignleft { float: left; max-width: 50%; margin: .5rem 2rem 1.25rem 0; }
.pan-post__body .aligncenter { display: block; margin-left: auto; margin-right: auto; }
.pan-post__body figure.alignright img, .pan-post__body figure.alignleft img { width: 100%; }
@media (max-width: 767.98px) {
	/* Stack floated images full-width on small screens. */
	.pan-post__body .alignright, .pan-post__body .alignleft {
		float: none;
		max-width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
}
.pan-post__body blockquote {
	margin: 1.75rem 0;
	padding: 1rem 1.5rem;
	border-left: 4px solid var(--pan-cyan);
	background: #f4f5f7;
	border-radius: 0 var(--pan-radius) var(--pan-radius) 0;
	font-size: 1.1rem;
}
.pan-post__body blockquote p:last-child { margin-bottom: 0; }
.pan-post__body table { width: 100%; border-collapse: collapse; margin: 0 0 1.75rem; }
.pan-post__body th, .pan-post__body td { border: 1px solid #e6eaef; padding: .65rem .85rem; text-align: left; }
.pan-post__body th { background: #f4f5f7; font-family: var(--pan-display); }
.pan-post__pages { margin-top: 1.5rem; font-weight: 600; }

/* ============================================================
   Guides archive (blog index) — home.php
   ============================================================ */

/* Card date line (reuses the industries .pan-ilcard shell + hover). */
.pan-ilcard__date {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	margin-bottom: .5rem;
	font-family: var(--pan-display);
	font-weight: 600;
	font-size: .85rem;
	color: #6D7175;
}
.pan-ilcard__date i { color: var(--pan-cyan); font-size: .95rem; }
.pan-guides-grid .pan-ilcard__media { aspect-ratio: 16 / 10; }

/* Pagination */
.pan-guides .pagination-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.pan-guides .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .5rem;
	margin-top: 3rem;
}
.pan-guides .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.65rem;
	height: 2.65rem;
	padding: 0 .8rem;
	border: 1px solid #d4dae2;
	border-radius: var(--pan-radius);
	background: #fff;
	color: var(--pan-navy);
	text-decoration: none;
	font-family: var(--pan-display);
	font-weight: 600;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.pan-guides a.page-numbers:hover { background: var(--pan-navy); color: #fff; border-color: var(--pan-navy); }
.pan-guides .page-numbers.current { background: var(--pan-cyan); color: #06202e; border-color: var(--pan-cyan); }
.pan-guides .page-numbers.dots { border-color: transparent; background: none; }

/* ==========================================================================
   Flexible standard pages (page.php) — hero + flex middle + global bands.
   Section vertical rhythm mirrors .pan-home / .pan-client. The hero keeps its
   own .pan-chero padding; the image-grid/gallery band is edge-to-edge.
   ========================================================================== */
.pan-page > section:not(.pan-chero) { padding: 5rem 0; }
.pan-page > section.pan-grid { padding: 0; }

/* Rich Text flex block */
.pan-richtext__inner { max-width: 820px; margin-inline: auto; }
.pan-richtext--narrow .pan-richtext__inner { max-width: 640px; }
.pan-richtext--wide .pan-richtext__inner { max-width: none; }
/* White Card option — wraps the content (e.g. a shortcode/form) in a white box
   with a soft shadow. White in both modes, so it stands out on dark sections. */
.pan-richtext--boxed .pan-richtext__inner {
	background: #fff;
	border: 1px solid #e9edf1;
	border-top: 3px solid var(--pan-cyan);
	border-radius: var(--pan-radius);
	box-shadow: 0 6px 24px rgba(15, 26, 43, .06);
	padding: clamp(1.5rem, 3vw, 2.5rem);
}
/* Dark sections: navy top bar, matching the tabs + feature cards. (Both classes
   are on the same <section>, so the mode + modifier selectors are combined.) */
.pan-mode-dark.pan-richtext--boxed .pan-richtext__inner { border-top-color: var(--pan-navy); }
.pan-richtext__heading { font-size: clamp(1.8rem, 3vw, 2.6rem); margin-bottom: 1.25rem; }
.pan-richtext__body > :last-child { margin-bottom: 0; }
.pan-richtext__body img { max-width: 100%; height: auto; border-radius: var(--pan-radius); }

@media (max-width: 767.98px) {
	.pan-page > section:not(.pan-chero) { padding: 3.5rem 0; }
}

/* Feature Cards flex layout — white box + cyan top border + lift-on-hover,
   matching the core-service box grid (.pan-cbenefits / .pan-explore-core). */
.pan-fcards__head { margin-bottom: 3rem; }
.pan-fcards__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
.pan-fcards__intro { max-width: 720px; }
.pan-fcards__intro > :last-child { margin-bottom: 0; }
.pan-fcards__card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1rem;
	height: 100%;
	padding: 1.8rem;
	border-radius: var(--pan-radius);
	border: 1px solid transparent;
	border-top: 3px solid var(--pan-cyan);
	transition: transform .18s ease, box-shadow .18s ease;
}
.pan-mode-dark .pan-fcards__card,
.pan-mode-light .pan-fcards__card {
	background: #fff;
	border-color: #e9edf1;
	border-top-color: var(--pan-cyan);
	box-shadow: 0 6px 24px rgba(15, 26, 43, .06);
}
/* Dark sections (brand-blue bg): navy top bar so it stands off the light blue. */
.pan-mode-dark .pan-fcards__card { border-top-color: var(--pan-navy); }
.pan-fcards__card:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(15, 26, 43, .12); }
.pan-fcards__icon { color: var(--pan-cyan); font-size: 2.6rem; line-height: 1; display: inline-flex; }
.pan-fcards__icon img { max-width: 58px; max-height: 58px; width: auto; height: auto; object-fit: contain; }
.pan-fcards__title { font-family: var(--pan-display); font-weight: 700; color: var(--m-heading); font-size: 1.3rem; line-height: 1.2; margin: 0; }
.pan-fcards__text { font-size: .95rem; margin: 0; }
.pan-fcards__btn { margin-top: auto; }

/* ==========================================================================
   Gravity Forms — brand card styling.
   The form wrapper matches the core-service "benefits" box (white bg, 3px cyan
   top bar, soft shadow) — but static (no hover lift). Submit button matches
   .pan-btn--primary: brand light-blue bg + dark navy text. !important beats the
   bundled Gravity Forms "orbital" theme.
   ========================================================================== */
.gform_wrapper,
.gform_wrapper.gform-theme--orbital {
	background: #fff !important;
	border: 1px solid #e9edf1 !important;
	border-top: 3px solid var(--pan-cyan) !important;
	border-radius: var(--pan-radius) !important;
	box-shadow: 0 6px 24px rgba(15, 26, 43, .06) !important;
	padding: 2rem !important;
}
.gform_wrapper .gform_footer .gform_button,
.gform_wrapper .gform_button {
	display: inline-block;
	background: var(--pan-cyan) !important;
	color: var(--pan-navy) !important;
	border: 2px solid var(--pan-cyan) !important;
	border-radius: var(--pan-radius);
	font-family: var(--pan-display);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
	font-size: 1.05rem !important;
	padding: .95rem 2.4rem !important;
	cursor: pointer;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.gform_wrapper .gform_footer .gform_button:hover,
.gform_wrapper .gform_button:hover {
	background: var(--pan-navy) !important;
	color: #fff !important;
	border-color: var(--pan-navy) !important;
}
@media (max-width: 767.98px) {
	.gform_wrapper,
	.gform_wrapper.gform-theme--orbital { padding: 1.25rem !important; }
}

/* ---------- Tabbed Content flex layout ---------- */
.pan-tabs__head { margin-bottom: 2.5rem; }
.pan-tabs__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
.pan-tabs__intro { max-width: 720px; }
.pan-tabs__intro > :last-child { margin-bottom: 0; }
/* Tabs + panels live in a white card with a cyan top bar + soft shadow, like the
   feature cards. Stays white in both color modes (only the section bg changes). */
.pan-tabs__wrap {
	background: #fff;
	border: 1px solid #e9edf1;
	border-top: 3px solid var(--pan-cyan);
	border-radius: var(--pan-radius);
	box-shadow: 0 6px 24px rgba(15, 26, 43, .06);
	padding: 1.75rem clamp(1.25rem, 3vw, 2rem) 2rem;
}
/* Dark sections (brand-blue bg): navy top bar, matching the feature cards. */
.pan-mode-dark .pan-tabs__wrap { border-top-color: var(--pan-navy); }
.pan-tabs__nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .25rem 1.75rem;
	margin-bottom: 2.5rem;
	border-bottom: 1px solid rgba(15, 26, 43, .12);
}
.pan-tabs__tab {
	appearance: none;
	background: none;
	border: 0;
	border-bottom: 3px solid transparent;
	margin-bottom: -1px;
	padding: .75rem .25rem;
	font-family: var(--pan-display);
	font-weight: 600;
	font-size: 1.05rem;
	color: var(--m-body);
	cursor: pointer;
	transition: color .15s ease, border-color .15s ease;
}
.pan-tabs__tab:hover { color: var(--m-heading); }
.pan-tabs__tab.is-active { color: var(--m-heading); border-bottom-color: var(--pan-cyan); }
.pan-tabs__panel { display: none; }
.pan-tabs__panel.is-active { display: block; }
.pan-tabs__media { border-radius: var(--pan-radius); overflow: hidden; }
.pan-tabs__media img { width: 100%; height: auto; display: block; }
.pan-tabs__body > :last-child { margin-bottom: 0; }

/* ==========================================================================
   Contact template (template-contact.php)
   ========================================================================== */
.pan-contact-page > section:not(.pan-chero) { padding: 5rem 0; }

/* Left column — contact details */
.pan-contact__aside-heading { font-size: 1.15rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--m-heading); margin-bottom: 1.5rem; }
.pan-contact__list { margin: 0; padding-left: 0; }
.pan-contact__list li { display: flex; align-items: flex-start; gap: .65rem; margin-bottom: 1.1rem; font-weight: 600; font-size: .95rem; color: var(--m-heading); line-height: 1.5; }
.pan-contact__list i { color: var(--pan-cyan); margin-top: .15rem; flex: none; }
.pan-contact__list a { color: inherit; text-decoration: none; }
.pan-contact__list a:hover { color: var(--pan-cyan); }

/* Right column — white form card (cyan top bar + shadow) */
.pan-contact__card {
	background: #fff;
	border: 1px solid #e9edf1;
	border-top: 3px solid var(--pan-cyan);
	border-radius: var(--pan-radius);
	box-shadow: 0 6px 24px rgba(15, 26, 43, .06);
	padding: clamp(1.5rem, 3vw, 2.5rem);
}
.pan-contact__intro { color: var(--m-body); margin-bottom: 1.5rem; }
/* Pasted form embed (iframe) fills the card width; height comes from the embed. */
.pan-contact__card iframe { width: 100%; max-width: 100%; border: 0; display: block; }
/* Flatten the Gravity Form inside the card so it reads as one card, not two. */
.pan-contact__card .gform_wrapper,
.pan-contact__card .gform_wrapper.gform-theme--orbital {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
}

/* Stats band */
.pan-stats__item { position: relative; padding: 1.25rem .5rem; }
.pan-stats__star { position: absolute; top: 46%; left: 50%; transform: translate(-50%, -50%); font-size: 4.75rem; color: rgba(27, 40, 63, .06); z-index: 0; }
.pan-stats__num { position: relative; z-index: 1; font-family: var(--pan-display); font-weight: 800; font-size: clamp(1.9rem, 3vw, 2.7rem); line-height: 1; color: var(--pan-navy); }
.pan-stats__label { position: relative; z-index: 1; margin-top: .4rem; font-weight: 600; font-size: .9rem; color: var(--m-body); }

@media (max-width: 767.98px) {
	.pan-contact-page > section:not(.pan-chero) { padding: 3.5rem 0; }
}

/* ==========================================================================
   Video Gallery template (template-video-gallery.php)
   ========================================================================== */
.pan-video-page > section:not(.pan-chero) { padding: 5rem 0; }
.pan-vgallery__head { margin-bottom: 3rem; }
.pan-vgallery__heading { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 1rem; }
.pan-vgallery__intro { max-width: 720px; }
.pan-vgallery__intro > :last-child { margin-bottom: 0; }

/* Thumbnail button */
.pan-vgallery__item { display: block; width: 100%; padding: 0; border: 0; background: none; text-align: left; cursor: pointer; }
.pan-vgallery__thumb {
	position: relative;
	display: block;
	aspect-ratio: 405 / 720;
	border-radius: var(--pan-radius);
	overflow: hidden;
	background: #e9edf1;
	box-shadow: 0 6px 24px rgba(15, 26, 43, .08);
}
.pan-vgallery__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.pan-vgallery__item:hover .pan-vgallery__thumb img { transform: scale(1.05); }
.pan-vgallery__thumb.pan-media-placeholder { display: flex; align-items: center; justify-content: center; color: #b5bec9; font-size: 2.5rem; }
.pan-vgallery__play {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
	width: 64px; height: 64px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: var(--pan-cyan); color: var(--pan-navy);
	font-size: 2rem; line-height: 1;
	box-shadow: 0 4px 16px rgba(15, 26, 43, .3);
	transition: transform .18s ease, background .18s ease;
}
.pan-vgallery__item:hover .pan-vgallery__play { transform: translate(-50%, -50%) scale(1.08); }
.pan-vgallery__title { display: block; margin-top: 1rem; font-family: var(--pan-display); font-weight: 700; font-size: 1.15rem; color: var(--m-heading); line-height: 1.3; }
.pan-vgallery__item:hover .pan-vgallery__title { color: var(--pan-cyan); }

/* Popup player */
.pan-vmodal__content { background: transparent; border: 0; }
.pan-vmodal__close { position: absolute; top: -2.75rem; right: 0; opacity: .9; }
.pan-vmodal__close:hover { opacity: 1; }
.pan-vmodal__player .ratio { background: #000; border-radius: var(--pan-radius); overflow: hidden; }