/* =========================================================================
   Prime Billboard — Pro visual upgrade layer (loads after prime-billboard.css)
   Adds depth, gradient typography, glow, scroll-reveal, a mobile menu and a
   comprehensive mobile pass. Scoped under .pbc so nothing leaks.
   ========================================================================= */

html { scroll-behavior: smooth; }

/* ---------- Scroll-reveal (gated by .pbc-reveal-ready so content never hides if JS fails) ---------- */
.pbc-reveal-ready [data-reveal] {
	opacity: 0; transform: translateY(30px);
	transition: opacity .7s cubic-bezier(.16,.84,.44,1), transform .7s cubic-bezier(.16,.84,.44,1);
}
.pbc-reveal-ready [data-reveal].is-visible { opacity: 1; transform: none; }

/* ---------- Scroll progress bar ---------- */
.pbc-progress { position: fixed; inset: 0 0 auto 0; height: 3px; z-index: 60; pointer-events: none; }
.pbc-progress__bar { height: 100%; width: 0; background: linear-gradient(90deg, hsl(45 96% 62%), hsl(34 92% 50%)); box-shadow: 0 0 14px hsl(38 92% 55% / .8); }

/* ---------- Ambient glow + gradient type ---------- */
.pbc-hero::before {
	content: ""; position: absolute; top: -15%; left: 50%; transform: translateX(-50%);
	width: 90%; height: 70%; z-index: 0; pointer-events: none;
	background: radial-gradient(closest-side, hsl(38 92% 55% / .20), transparent 72%); filter: blur(50px);
}
.pbc-hero__overlay {
	background:
		radial-gradient(130% 90% at 50% 6%, transparent 40%, hsl(var(--background) / .55) 72%, hsl(var(--background)) 100%),
		linear-gradient(to bottom, hsl(var(--background) / .5), hsl(var(--background) / .68) 55%, hsl(var(--background)));
}
.pbc-hero__title { background: linear-gradient(180deg, #ffffff, #cfd2d8); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.pbc-hero__title .pbc-text-primary { background: linear-gradient(180deg, hsl(46 96% 64%), hsl(34 92% 50%)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.pbc-section__head .pbc-h2 { background: linear-gradient(180deg, #ffffff, #c7cad1); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; letter-spacing: -.02em; }

/* glassy badge + glow */
.pbc-badge { background: linear-gradient(135deg, hsl(var(--primary) / .18), hsl(var(--primary) / .05)); box-shadow: inset 0 0 0 1px hsl(var(--primary) / .25); backdrop-filter: blur(6px); }

/* ---------- Hero stat chips (glassmorphism) ---------- */
.pbc-hero__stats { gap: 1rem 1.25rem; }
.pbc-stat { background: hsl(var(--card) / .45); border: 1px solid hsl(var(--border)); border-radius: 1rem; padding: .65rem .9rem; backdrop-filter: blur(10px); box-shadow: 0 18px 40px -28px rgba(0,0,0,.9); }
.pbc-stat__icon { background: linear-gradient(135deg, hsl(var(--primary) / .28), hsl(var(--primary) / .08)); box-shadow: 0 8px 20px -10px hsl(var(--primary) / .5); }

/* ---------- Buttons: lift, glow, shimmer ---------- */
.pbc-btn { transition: transform .22s cubic-bezier(.16,.84,.44,1), box-shadow .22s, background .22s; }
.pbc-btn--primary { position: relative; overflow: hidden; box-shadow: 0 12px 34px -12px hsl(var(--primary) / .55), inset 0 0 0 1px hsl(var(--primary) / .35); }
.pbc-btn--primary::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 35%, rgba(255,255,255,.4) 50%, transparent 65%); transform: translateX(-130%); transition: transform .85s ease; }
.pbc-btn--primary:hover::after { transform: translateX(130%); }
.pbc-btn--primary:hover, .pbc-btn--lg:hover { transform: translateY(-2px); }
.pbc-header__cta { box-shadow: 0 8px 22px -10px hsl(var(--primary) / .7); }

/* ---------- Cards: depth + glow on hover ---------- */
.pbc-card, .pbc-feature, .pbc-pkg-card, .pbc-zone-card, .pbc-campaign-card, .pbc-faq-item, .pbc-loc-stat {
	box-shadow: inset 0 1px 0 hsl(0 0% 100% / .03), 0 16px 36px -28px rgba(0,0,0,.85);
	transition: transform .26s cubic-bezier(.16,.84,.44,1), border-color .26s, box-shadow .26s;
}
.pbc-feature:hover, .pbc-loc-stat:hover { transform: translateY(-5px); border-color: hsl(var(--primary) / .4); box-shadow: 0 26px 46px -28px hsl(var(--primary) / .5); }
.pbc-pkg-card:hover { transform: translateY(-4px); }
.pbc-feature__icon, .pbc-loc-stat__icon { background: linear-gradient(135deg, hsl(var(--primary) / .24), hsl(var(--primary) / .06)); box-shadow: 0 8px 20px -10px hsl(var(--primary) / .45); transition: transform .26s; }
.pbc-feature:hover .pbc-feature__icon { transform: scale(1.1) rotate(-4deg); }
.pbc-pill--primary, .pbc-pill--accent { box-shadow: 0 6px 16px -8px hsl(var(--primary) / .6); }
.pbc-header.is-scrolled { box-shadow: 0 14px 34px -26px rgba(0,0,0,.95); }

/* gallery zoom easing + caption gradient already present; add lift */
.pbc-campaign-card:hover { box-shadow: 0 30px 50px -30px hsl(var(--primary) / .45); }

/* scroll indicator bounce on hero CTA chevron area */
.pbc-hero__content { position: relative; z-index: 1; }

/* ========================================================================
   MOBILE MENU (markup injected by prime-enhance.js)
   ======================================================================== */
.pbc-burger { display: none; }
.pbc-mobile-menu { position: fixed; inset: 0; z-index: 55; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.25rem;
	background: hsl(var(--background) / .97); backdrop-filter: blur(14px); opacity: 0; pointer-events: none; transition: opacity .3s; }
.pbc-mobile-menu.is-open { opacity: 1; pointer-events: auto; }
.pbc-mobile-menu a { font-size: 1.45rem; font-weight: 800; color: #fff; }
.pbc-mobile-menu a.cta { margin-top: .75rem; padding: .85rem 2.25rem; border-radius: 999px; background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); box-shadow: 0 12px 30px -12px hsl(var(--primary) / .7); }
.pbc-mobile-close { position: absolute; top: 1.1rem; left: 1.1rem; width: 44px; height: 44px; border-radius: 12px; background: hsl(var(--card)); border: 1px solid hsl(var(--border)); color: #fff; font-size: 1.1rem; }

/* ========================================================================
   COMPREHENSIVE MOBILE PASS
   ======================================================================== */
@media (max-width: 767px) {
	.pbc-section { padding: 3.5rem 1.1rem; }
	.pbc-section__head { margin-bottom: 2.25rem; }

	.pbc-header__nav { display: none !important; }
	.pbc-burger { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 12px; background: hsl(var(--card) / .6); border: 1px solid hsl(var(--border)); color: #fff; backdrop-filter: blur(6px); }

	.pbc-hero { min-height: 92vh; }
	.pbc-hero__title { font-size: clamp(2.5rem, 13vw, 3.4rem); margin-bottom: 1.1rem; }
	.pbc-hero__sub { font-size: 1rem; margin-bottom: 2rem; }
	.pbc-hero__stats { gap: .6rem; width: 100%; }
	.pbc-stat { flex: 1 1 28%; flex-direction: column; text-align: center; gap: .35rem; padding: .7rem .35rem; }
	.pbc-stat__icon { width: 2.4rem; height: 2.4rem; font-size: 1rem; }
	.pbc-stat__val { font-size: 1.1rem; }
	.pbc-stat__label { font-size: .62rem; line-height: 1.25; }
	.pbc-btn--lg { width: 100%; }

	.pbc-h2 { font-size: clamp(1.7rem, 7.5vw, 2.2rem); }
	.pbc-lead { font-size: 1rem; }

	/* touch targets >= 44px */
	.pbc-day-pill, .pbc-preset, .pbc-btn, .pbc-zone-card, .pbc-faq-q { min-height: 44px; }
	.pbc-stepper button { width: 2.75rem; height: 2.75rem; }
	.pbc-pkg-select { min-height: 44px; }

	/* packages / grids single column */
	.pbc-pkg-grid.pbc-cols-2 { grid-template-columns: 1fr; }
	.pbc-pkg-card__top h4 { font-size: 1.3rem; }
	.pbc-campaign-card { height: 20rem; }
	.pbc-location-map .pbc-card { height: 15rem; }
	.pbc-traffic { padding: 1.4rem; }
	.pbc-summary { grid-template-columns: 1fr; }
	.pbc-modal__grid { padding: 1.25rem; gap: 1rem; }
	.pbc-modal__img { height: 12rem; }
	.pbc-faq-a p { padding-right: 3.1rem; padding-left: 1.1rem; }

	/* simulator on mobile */
	.pbc-steps { gap: .25rem; }
	.pbc-step { padding: .4rem .55rem; }
	.pbc-sim__zones.pbc-cols-3 { grid-template-columns: 1fr 1fr; }
	.pbc-zone-card h4 { font-size: .95rem; }
	.pbc-dropzone { padding: 1.75rem 1rem; }

	/* hero stat icons row keep tidy */
	.pbc-pricing-presets { gap: .5rem; }
	.pbc-progress { height: 2px; }
}

/* very small phones */
@media (max-width: 380px) {
	.pbc-hero__title { font-size: 2.2rem; }
	.pbc-stat__label { font-size: .58rem; }
}

/* accessibility: focus-visible + reduced motion */
.pbc a:focus-visible, .pbc button:focus-visible, .pbc input:focus-visible, .pbc select:focus-visible, .pbc textarea:focus-visible {
	outline: 2px solid hsl(var(--primary)); outline-offset: 2px; border-radius: 6px;
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.pbc-reveal-ready [data-reveal] { opacity: 1 !important; transform: none !important; }
	.pbc-btn--primary::after { display: none; }
}

/* =========================================================================
   v1.0.5 — Pro upgrade round 2 (design-agent spec): simulator centerpiece,
   ambient depth, premium cards/buttons, sticky mobile CTA, mobile polish.
   ========================================================================= */

/* ---------- Ambient background depth (1 fixed mesh + vignette, GPU-cheap) ---------- */
.pbc { position: relative; isolation: isolate; }
.pbc::before {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background:
		radial-gradient(60% 50% at 82% 0%, hsl(var(--primary) / .07), transparent 70%),
		radial-gradient(48% 40% at 8% 26%, hsl(220 60% 30% / .06), transparent 70%),
		radial-gradient(125% 120% at 50% 100%, transparent 55%, hsl(var(--background)) 100%);
}

/* ---------- SIMULATOR — wide framed centerpiece ---------- */
[data-pbc-simulator] .pbc-container { max-width: 76rem; }
.pbc-sim__scene-wrap {
	border: 1px solid hsl(var(--border));
	border-radius: calc(var(--radius) + .35rem);
	background: hsl(var(--card));
	box-shadow: inset 0 1px 0 hsl(0 0% 100% / .05), 0 34px 64px -26px rgba(0,0,0,.75);
}
.pbc-sim__scene {
	aspect-ratio: 2.25 / 1;            /* matches the cropped viewBox — no black bars */
	background: hsl(var(--secondary) / .35);
	will-change: transform;
}
.pbc-sim__scene-head {
	padding: .75rem 1.1rem;
	background: linear-gradient(180deg, hsl(var(--card)), hsl(var(--secondary) / .4));
}
/* marching-ants + amber glow on the selected zone polygon */
.pbc-sim__scene polygon {
	stroke-width: 5; filter: drop-shadow(0 0 7px hsl(38 92% 55% / .55));
	animation: pbc-march 1.5s linear infinite;
}
@keyframes pbc-march { to { stroke-dashoffset: -90; } }

/* step indicator → connected rail with check on done */
.pbc-step { transition: background .3s, color .3s, transform .2s, box-shadow .2s; }
.pbc-step.is-active { transform: translateY(-1px); box-shadow: 0 6px 16px -6px hsl(var(--primary) / .45); }
.pbc-step.is-done .pbc-step__num { position: relative; }

/* zone cards: per-zone colour identity (--zc set by JS) + springy select */
.pbc-zone-card { position: relative; overflow: hidden; transition: transform .18s cubic-bezier(.34,1.56,.64,1), border-color .18s, box-shadow .18s, background .18s; }
.pbc-zone-card::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: 0; width: 3px; background: var(--zc, hsl(var(--primary))); opacity: .45; transition: opacity .18s, width .18s; }
.pbc-zone-card:hover { transform: translateY(-3px); box-shadow: 0 14px 26px -14px rgba(0,0,0,.6); }
.pbc-zone-card.is-selected { border-color: var(--zc, hsl(var(--primary))); box-shadow: inset 0 0 0 1px var(--zc, hsl(var(--primary))), 0 16px 32px -16px var(--zc, hsl(var(--primary))); }
.pbc-zone-card.is-selected::before { opacity: 1; width: 4px; }

/* step 2 form / step 3 summary read as editorial (narrow text over wide media) */
[data-step-panel="2"] .pbc-card, [data-step-panel="3"] .pbc-summary { margin-inline: auto; }

/* ---------- Premium card top-sheen (broad, cheap) ---------- */
.pbc-card, .pbc-feature, .pbc-pkg-card {
	background: linear-gradient(180deg, hsl(0 0% 100% / .03), transparent 42%), hsl(var(--card));
}

/* ---------- Buttons: metal gold + press ---------- */
.pbc-btn--primary { background: linear-gradient(180deg, hsl(38 96% 61%), hsl(36 92% 51%)); box-shadow: inset 0 1px 0 hsl(40 100% 82% / .6), 0 12px 26px -10px hsl(var(--primary) / .55); }
.pbc-btn:active { transform: translateY(1px) scale(.99); }

/* ---------- Section rhythm + anchor offset ---------- */
.pbc { --space-section: clamp(4.5rem, 9vw, 9rem); }
.pbc-section { scroll-margin-top: 5rem; }
[id] { scroll-margin-top: 5rem; }

/* ---------- Sticky mobile CTA (injected by JS) ---------- */
.pbc-sticky-cta { position: fixed; inset-inline: 0; bottom: 0; z-index: 58; display: none; gap: .5rem;
	padding: .6rem .8rem calc(.6rem + env(safe-area-inset-bottom));
	background: hsl(var(--background) / .9); backdrop-filter: blur(16px); border-top: 1px solid hsl(var(--border));
	transform: translateY(110%); transition: transform .32s cubic-bezier(.4,0,.2,1); }
.pbc-sticky-cta.is-visible { transform: none; }
.pbc-sticky-cta .pbc-btn { flex: 1; min-height: 50px; }

/* ---------- Mobile: simulator + touch ergonomics ---------- */
@media (hover: none) {
	.pbc-campaign-more { opacity: 1; }
	.pbc-gallery-item figcaption { opacity: 1; background: linear-gradient(to top, hsl(var(--background) / .85), transparent 60%); }
}
@media (max-width: 768px) {
	.pbc-sticky-cta { display: flex; }
	.pbc-btn, .pbc-day-pill, .pbc-preset, .pbc-faq-q, .pbc-pkg-select { min-height: 48px; }
	.pbc-stepper button { width: 48px; height: 48px; }
	[data-pbc-simulator] .pbc-container { max-width: 100%; }
}
@media (max-width: 640px) {
	.pbc-sim__scene { aspect-ratio: 16 / 10; }
	.pbc-sim__zones, .pbc-sim__zones.pbc-cols-3 { grid-template-columns: 1fr; }
	.pbc-zone-card { min-height: 56px; }
}
.pbc button, .pbc a { -webkit-tap-highlight-color: transparent; }