@charset "UTF-8";
/* =========================================================================
   Purple Prince Commerce — commerce.css
   Crisp ecommerce-agency layout. Loads after the parent's main.css.
   ========================================================================= */

:root {
	--ppc-ink:      #1A1420;
	--ppc-deep:     #1E1230;   /* hero / dark bands */
	--ppc-deep-2:   #2A1B3D;   /* logo aubergine */
	--ppc-pop:      #9333EA;
	--ppc-pop-dk:   #7C29CE;
	--ppc-pop-lt:   #C084FC;
	--ppc-lilac:    #7B4FA0;
	--ppc-tint:     #F7F3FB;
	--ppc-tint-2:   #EFE7F6;
	--ppc-line:     #E6DEEE;
	--ppc-muted:    #5F516B;
	--ppc-white:    #FFFFFF;

	--ppc-radius:    12px;
	--ppc-radius-sm: 8px;
	--ppc-shadow:    0 1px 2px rgba(30, 18, 48, .06), 0 8px 24px -12px rgba(30, 18, 48, .18);
	--ppc-shadow-lg: 0 30px 60px -20px rgba(30, 18, 48, .45);
	--ppc-ease:      cubic-bezier(.22, 1, .36, 1);
	--ppc-section:   clamp(3.5rem, 2.5rem + 4vw, 6.5rem);

	/* The parent uses --pp-sunshine (green) as a general accent. Green isn't
	   a brand colour, so swap it for light lilac. Service-status dots keep
	   their own hard-coded green. */
	--pp-sunshine:   var(--ppc-pop-lt);
}

/* CF7 "message sent" box — purple instead of green. */
.wpcf7-form.sent .wpcf7-response-output {
	background: var(--ppc-tint) !important;
	border-color: var(--ppc-pop) !important;
	color: var(--ppc-deep-2) !important;
}

body.ppc { background: var(--ppc-white); color: var(--ppc-ink); }

.ppc-icon { width: 1.25em; height: 1.25em; flex: none; }

/* -------------------- Shared bits -------------------- */
/* No eyebrow labels anywhere — including the parent's .pp-eyebrow on inner
   templates and in page content. */
.ppc .pp-eyebrow, .ppc .ppc-eyebrow { display: none !important; }

.ppc-eyebrow {
	margin: 0 0 .75rem;
	font: 600 .78rem/1 var(--pp-font-body);
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ppc-pop);
}
.ppc-eyebrow--light { color: var(--ppc-pop-lt); }

.ppc-heading { margin-bottom: 2rem; max-width: 46rem; }
.ppc-heading--center { margin-inline: auto; text-align: center; }
.ppc-heading__title {
	margin: 0;
	font: 700 clamp(1.75rem, 1.35rem + 1.6vw, 2.75rem)/1.12 var(--pp-font-display);
	letter-spacing: -.02em;
	color: inherit;
}
.ppc-heading__title em { font-style: normal; color: var(--ppc-pop); }
.ppc-heading__intro { margin: 1rem 0 0; font-size: 1.1rem; color: var(--ppc-muted); }

.ppc-heading-row {
	display: flex; flex-wrap: wrap; gap: 1rem 2rem;
	align-items: flex-end; justify-content: space-between;
	margin-bottom: 2rem;
}
.ppc-heading-row .ppc-heading { margin-bottom: 0; }

.ppc-prose p { margin: 0 0 1rem; color: var(--ppc-muted); font-size: 1.05rem; }
.ppc-prose p:last-child { margin-bottom: 0; }

.ppc-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.ppc-actions--center { justify-content: center; }

.ppc-section { padding-block: var(--ppc-section); }
.ppc-section--tint { background: var(--ppc-tint); }

.ppc-split {
	display: grid; gap: clamp(2rem, 5vw, 5rem);
	grid-template-columns: 1fr; align-items: center;
}
@media (min-width: 900px) { .ppc-split { grid-template-columns: 1.1fr 1fr; } }

.ppc-link {
	display: inline-flex; align-items: center; gap: .4rem;
	font-weight: 600; color: var(--ppc-pop);
}
.ppc-link .ppc-icon { width: 1em; height: 1em; transition: transform .2s var(--ppc-ease); }
.ppc-link:hover .ppc-icon { transform: translateX(3px); }

.ppc-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: .85rem; }
.ppc-checklist li { display: flex; gap: .7rem; align-items: flex-start; font-weight: 500; }
.ppc-checklist .ppc-icon {
	width: 1.4rem; height: 1.4rem; padding: .25rem;
	border-radius: 50%; background: var(--ppc-pop); color: #fff; stroke-width: 3;
}
.ppc-checklist--sm { gap: .5rem; margin-bottom: 1rem; font-size: .95rem; }
.ppc-checklist--sm .ppc-icon { width: 1.15rem; height: 1.15rem; }

/* -------------------- Buttons -------------------- */
.ppc-btn {
	display: inline-flex; align-items: center; gap: .55rem;
	padding: .85rem 1.35rem;
	border: 2px solid transparent; border-radius: var(--ppc-radius-sm);
	font: 600 .98rem/1.1 var(--pp-font-body);
	text-decoration: none; white-space: nowrap; cursor: pointer;
	transition: background .2s var(--ppc-ease), color .2s var(--ppc-ease), border-color .2s var(--ppc-ease), transform .2s var(--ppc-ease);
}
.ppc-btn .ppc-icon { width: 1.1em; height: 1.1em; stroke-width: 2.4; }
.ppc-btn:hover { transform: translateY(-1px); }
.ppc-btn--primary { background: var(--ppc-pop); color: #fff; }
.ppc-btn--primary:hover { background: var(--ppc-pop-dk); color: #fff; }
.ppc-btn--outline { border-color: var(--ppc-deep-2); color: var(--ppc-deep-2); }
.ppc-btn--outline:hover { background: var(--ppc-deep-2); color: #fff; }
.ppc-btn--light { background: #fff; color: var(--ppc-deep); }
.ppc-btn--light:hover { background: var(--ppc-pop-lt); color: var(--ppc-deep); }
.ppc-btn--ghost-light { border-color: rgba(255,255,255,.35); color: #fff; }
.ppc-btn--ghost-light:hover { border-color: #fff; background: rgba(255,255,255,.08); color: #fff; }

/* Parent buttons used on inner templates — bring them in line. */
.ppc .pp-btn { border-radius: var(--ppc-radius-sm); box-shadow: none; }
.ppc .pp-btn--primary { background: var(--ppc-pop); }
.ppc .pp-btn--primary:hover { background: var(--ppc-pop-dk); }

/* -------------------- Top bar -------------------- */
.ppc-topbar { background: var(--ppc-ink); color: rgba(255,255,255,.75); font-size: .82rem; }
.ppc-topbar__inner {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	min-height: 2.5rem;
}
.ppc-topbar__tag { margin: 0; }
.ppc-topbar__links { display: flex; gap: 1.5rem; margin: 0; padding: 0; list-style: none; }
.ppc-topbar a { color: rgba(255,255,255,.85); display: inline-flex; align-items: center; gap: .4rem; }
.ppc-topbar a:hover { color: #fff; }
.ppc-topbar .ppc-icon { width: .95rem; height: .95rem; color: var(--ppc-pop-lt); }
@media (max-width: 899px) {
	.ppc-topbar__tag, .ppc-topbar__links li:not(:last-child) { display: none; }
	.ppc-topbar__inner { justify-content: center; }
}

/* -------------------- Header -------------------- */
.ppc-header {
	position: sticky; top: 0; z-index: 100;
	background: #fff; border-bottom: 1px solid var(--ppc-line);
	transition: box-shadow .2s var(--ppc-ease);
}
.ppc-header.is-scrolled { box-shadow: 0 8px 24px -16px rgba(30,18,48,.35); }
.ppc-header__inner { display: flex; align-items: center; gap: 2rem; min-height: 5rem; }
.ppc-header__brand img { width: auto; max-height: 3.25rem; }
.ppc-header__nav { flex: 1; }
.ppc-header__actions { display: flex; align-items: center; gap: .75rem; margin-left: auto; }

.ppc-header__search {
	display: grid; place-items: center;
	width: 2.75rem; height: 2.75rem;
	border: 1px solid var(--ppc-line); border-radius: var(--ppc-radius-sm);
	background: #fff; color: var(--ppc-deep-2); cursor: pointer;
}
.ppc-header__search:hover, .ppc-header__search[aria-expanded="true"] { border-color: var(--ppc-pop); color: var(--ppc-pop); }

.ppc-nav .pp-nav__list { display: flex; gap: .25rem; margin: 0; padding: 0; list-style: none; }
.ppc-nav .pp-nav__link {
	display: inline-flex; align-items: center; gap: .45rem;
	padding: .65rem .9rem; border: 0; border-radius: var(--ppc-radius-sm);
	background: none; color: var(--ppc-ink);
	font: 600 1rem/1 var(--pp-font-body); cursor: pointer;
}
.ppc-nav .pp-nav__link:hover,
.ppc-nav .pp-nav__link[aria-expanded="true"],
.ppc-nav .pp-nav__link.is-current { color: var(--ppc-pop); background: var(--ppc-tint); }
.ppc-nav .pp-nav__link svg { transition: transform .2s var(--ppc-ease); }
.ppc-nav .pp-nav__link[aria-expanded="true"] svg { transform: rotate(180deg); }
.ppc-nav .pp-nav__item { position: static; }
.ppc-nav .pp-nav__link::after { display: none; }

/* Mega panel — full width under the header. */
.ppc-header .ppc-mega {
	position: absolute; left: 0; right: 0; top: 100%;
	margin: 0; padding: 0; width: auto; transform: none;
	background: #fff; border-top: 1px solid var(--ppc-line);
	box-shadow: 0 30px 50px -30px rgba(30,18,48,.4);
	border-radius: 0;
}
.ppc-header .ppc-mega[hidden] { display: none; }
.ppc-mega__inner {
	display: grid; grid-template-columns: 17rem 1fr; gap: 3rem;
	padding-block: 2.25rem 2.5rem;
}
.ppc-mega__intro {
	padding: 1.75rem; border-radius: var(--ppc-radius);
	background: linear-gradient(150deg, var(--ppc-deep) 0%, var(--ppc-deep-2) 60%, var(--ppc-lilac) 140%);
	color: #fff;
}
.ppc-mega__title { margin: 0 0 .6rem; font: 700 1.4rem/1.15 var(--pp-font-display); }
.ppc-mega__lede { margin: 0 0 1.25rem; font-size: .95rem; color: rgba(255,255,255,.78); line-height: 1.55; }
.ppc-mega__all { font-weight: 600; color: var(--ppc-pop-lt); }
.ppc-mega__all:hover { color: #fff; }
.ppc-mega__cols {
	display: grid; gap: 1.75rem 2rem;
	grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
	align-content: start;
}
.ppc-mega__heading {
	margin: 0 0 .65rem; padding-bottom: .5rem;
	border-bottom: 2px solid var(--ppc-tint-2);
	font: 700 .78rem/1 var(--pp-font-body); letter-spacing: .1em; text-transform: uppercase;
	color: var(--ppc-lilac);
}
.ppc-mega__col ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .1rem; }
.ppc-mega__link {
	display: block; padding: .35rem 0; color: var(--ppc-ink); font-size: .95rem; font-weight: 500;
	transition: color .15s, transform .15s var(--ppc-ease);
}
.ppc-mega__link:hover, .ppc-mega__link.is-current { color: var(--ppc-pop); transform: translateX(3px); }

/* Search drawer */
.ppc-search { border-top: 1px solid var(--ppc-line); background: var(--ppc-tint); padding-block: 1.25rem; }
.ppc-search[hidden] { display: none; }
.ppc-search__form { display: flex; gap: .75rem; }
.ppc-search__form input {
	flex: 1; min-width: 0; padding: .85rem 1rem;
	border: 1px solid var(--ppc-line); border-radius: var(--ppc-radius-sm);
	font: inherit; background: #fff;
}
.ppc-search__form input:focus { outline: 2px solid var(--ppc-pop); outline-offset: 1px; }

/* Burger + mobile nav */
.ppc-header__burger { display: none; }
@media (max-width: 1099px) {
	.ppc-header__nav { display: none; }
	.ppc-header__actions > .ppc-btn { display: none; }
	.ppc-header__burger {
		display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
		width: 2.75rem; height: 2.75rem; padding: 0 .7rem;
		border: 1px solid var(--ppc-line); border-radius: var(--ppc-radius-sm); background: #fff; cursor: pointer;
	}
	.ppc-header__burger span { display: block; height: 2px; background: var(--ppc-deep-2); border-radius: 2px; transition: transform .2s, opacity .2s; }
	.ppc-header__burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	.ppc-header__burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
	.ppc-header__burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}
.ppc-mobile-nav {
	max-height: calc(100vh - 5rem); overflow-y: auto;
	padding: 1rem 16px 2rem; border-top: 1px solid var(--ppc-line); background: #fff;
}
.ppc-mobile-nav[hidden] { display: none; }
.ppc-mobile-nav .ppc-btn { width: 100%; justify-content: center; margin-top: 1rem; }
.ppc-mobile-nav__phone { display: flex; align-items: center; justify-content: center; gap: .5rem; margin-top: 1rem; font-weight: 600; color: var(--ppc-deep-2); }
@media (min-width: 1100px) { .ppc-mobile-nav { display: none !important; } }

/* -------------------- Hero -------------------- */
@property --ppc-ang { syntax: '<angle>'; initial-value: 0deg; inherits: false; }

.ppc-hero {
	--mx: 0; --my: 0; --sx: 70%; --sy: 30%;
	position: relative; overflow: hidden; isolation: isolate;
	padding-top: clamp(3.5rem, 2rem + 5vw, 6.5rem);
	background: #160C24; color: #fff;
}

/* Background effects */
.ppc-hero__fx { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.ppc-hero__aurora span {
	position: absolute; border-radius: 50%;
	filter: blur(90px); mix-blend-mode: screen;
	animation: ppc-aurora 18s ease-in-out infinite alternate;
}
.ppc-hero__aurora span:nth-child(1) { width: 46rem; height: 34rem; top: -16rem; right: -12rem; background: #7C29CE; opacity: .6; }
.ppc-hero__aurora span:nth-child(2) { width: 38rem; height: 30rem; bottom: -20rem; left: -12rem; background: #A855F7; opacity: .35; animation-duration: 24s; animation-delay: -8s; }
.ppc-hero__aurora span:nth-child(3) { width: 28rem; height: 22rem; top: 25%; left: 38%; background: #5B21B6; opacity: .35; animation-duration: 28s; animation-delay: -4s; }
@keyframes ppc-aurora {
	0%   { transform: translate(0, 0) scale(1); }
	50%  { transform: translate(-6rem, 4rem) scale(1.15); }
	100% { transform: translate(4rem, -3rem) scale(.92); }
}

.ppc-hero__floor {
	position: absolute; left: -50%; right: -50%; bottom: 0; height: 60%;
	background-image:
		linear-gradient(rgba(192, 132, 252, .22) 1px, transparent 1px),
		linear-gradient(90deg, rgba(192, 132, 252, .22) 1px, transparent 1px);
	background-size: 64px 64px;
	transform: perspective(520px) rotateX(64deg);
	transform-origin: 50% 100%;
	-webkit-mask-image: linear-gradient(to top, #000 0%, transparent 80%);
	        mask-image: linear-gradient(to top, #000 0%, transparent 80%);
	animation: ppc-floor 3.5s linear infinite;
}
@keyframes ppc-floor { to { background-position: 0 64px, 0 0; } }

.ppc-hero__canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.ppc-hero__spot {
	position: absolute; inset: 0;
	background: radial-gradient(38rem circle at var(--sx) var(--sy), rgba(192, 132, 252, .16), transparent 60%);
}
.ppc-hero__noise {
	position: absolute; inset: 0; opacity: .08; mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* Layout */
.ppc-hero__inner {
	position: relative; display: grid; gap: 3rem; align-items: center;
	grid-template-columns: 1fr;
}
@media (min-width: 1000px) { .ppc-hero__inner { grid-template-columns: 1.12fr 1fr; gap: 2rem; } }

/* Entrance helpers — keyframes only define the start, so with motion
   disabled everything simply shows in its final state. They start at
   opacity .01 (not 0) so browsers count the text as painted for LCP. */
.ppc-fade { animation: ppc-rise .9s var(--ppc-ease) backwards; animation-delay: var(--d, 0ms); }
.ppc-build { animation: ppc-build .8s var(--ppc-ease) backwards; animation-delay: var(--d, 0ms); }
@keyframes ppc-rise  { from { opacity: .01; transform: translateY(24px); filter: blur(6px); } }
@keyframes ppc-build { from { opacity: .01; transform: translateY(16px) scale(.95); } }

/* Copy */
@keyframes ppc-ping { 75%, 100% { transform: scale(2.8); opacity: 0; } }

.ppc-hero__title {
	margin: 0; color: #fff;
	font: 800 clamp(2.5rem, 1.5rem + 3.2vw, 4rem)/1.04 var(--pp-font-display);
	letter-spacing: -.035em;
}
.ppc-hero__line { display: block; }
.ppc-hero__line > span {
	display: inline-block;
	animation: ppc-word 1s var(--ppc-ease) backwards;
	animation-delay: calc(var(--i) * 90ms + 150ms);
}
@keyframes ppc-word { from { opacity: .01; transform: translateY(.55em) rotate(3deg); filter: blur(10px); } }

.ppc-hero__rotator {
	position: relative; display: inline-grid; padding-bottom: .18em;
	animation: ppc-word 1s var(--ppc-ease) backwards; animation-delay: 450ms;
}
.ppc-hero__rotator > span {
	grid-area: 1 / 1; white-space: nowrap;
	background: linear-gradient(90deg, #C084FC, #F5D0FE, #A855F7, #E9D5FF, #C084FC);
	background-size: 300% 100%;
	-webkit-background-clip: text; background-clip: text; color: transparent;
	opacity: 0; transform: translateY(.45em); filter: blur(10px);
	transition: opacity .7s var(--ppc-ease), transform .7s var(--ppc-ease), filter .7s var(--ppc-ease);
	animation: ppc-shimmer 6s linear infinite;
}
.ppc-hero__rotator > span.is-active { opacity: 1; transform: none; filter: none; }
.ppc-hero__rotator > span.is-leaving { opacity: 0; transform: translateY(-.45em); filter: blur(10px); }
/* Width of the longest phrase, reserved via CSS so swapping words never shifts the layout. */
.ppc-hero__rotator::before { content: attr(data-longest); grid-area: 1 / 1; visibility: hidden; white-space: nowrap; }
@keyframes ppc-shimmer { to { background-position: 300% 0; } }

.ppc-hero__squiggle {
	position: absolute; left: 0; bottom: 0; width: 100%; height: .3em; overflow: visible;
	fill: none; stroke: var(--ppc-pop); stroke-width: 5; stroke-linecap: round;
	stroke-dasharray: 320; stroke-dashoffset: 0;
	animation: ppc-draw 1.2s var(--ppc-ease) backwards; animation-delay: 1.1s;
}
@keyframes ppc-draw { from { stroke-dashoffset: 320; } }

.ppc-hero__lead { margin: 1.5rem 0 0; max-width: 34rem; font-size: 1.12rem; line-height: 1.65; color: rgba(255,255,255,.78); }
.ppc-hero__ctas { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 2.25rem; }
.ppc-hero__ticks { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin: 2rem 0 0; padding: 0; list-style: none; font-size: .92rem; color: rgba(255,255,255,.75); }
.ppc-hero__ticks li { display: flex; align-items: center; gap: .45rem; }
.ppc-hero__ticks .ppc-icon { width: 1rem; height: 1rem; color: var(--ppc-pop-lt); stroke-width: 3; }

/* Glowing, magnetic CTA */
[data-ppc-magnetic] { transition: translate .35s var(--ppc-ease), background .2s, color .2s, border-color .2s; }
.ppc-btn--glow { position: relative; box-shadow: 0 0 0 0 rgba(192,132,252,.5); animation: ppc-glow 2.8s ease-in-out infinite; }
.ppc-btn--glow::before {
	content: ""; position: absolute; inset: -3px; padding: 3px; border-radius: 11px; pointer-events: none;
	background: conic-gradient(from var(--ppc-ang), #C084FC, #7C29CE, #F5D0FE, #A855F7, #C084FC);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor; mask-composite: exclude;
	animation: ppc-spin 3.5s linear infinite;
}
@keyframes ppc-spin { to { --ppc-ang: 360deg; } }
@keyframes ppc-glow { 50% { box-shadow: 0 0 36px 2px rgba(192,132,252,.45); } }

/* Stage — 3D shop-front */
.ppc-stage {
	position: relative; perspective: 1400px;
	padding: 2.5rem 2rem 3.5rem;
	animation: ppc-stage-in 1.4s var(--ppc-ease) backwards; animation-delay: 200ms;
}
@keyframes ppc-stage-in { from { opacity: .01; transform: translateY(40px) scale(.94); } }
.ppc-stage__tilt {
	position: relative; transform-style: preserve-3d;
	transform: rotateY(calc(-12deg + var(--mx) * 9deg)) rotateX(calc(5deg - var(--my) * 7deg));
	transition: transform .5s cubic-bezier(.2, .8, .2, 1);
}

.ppc-shop {
	position: relative; border-radius: 14px; overflow: hidden;
	background: #fff; color: var(--ppc-ink);
	box-shadow: 0 60px 120px -30px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .12), 0 0 80px -10px rgba(147, 51, 234, .45);
}
.ppc-shop__bar { display: flex; align-items: center; gap: .35rem; padding: .7rem .9rem; background: var(--ppc-tint-2); }
.ppc-shop__bar > span { width: .6rem; height: .6rem; border-radius: 50%; background: #CDBBDF; }
.ppc-shop__bar i { flex: 1; margin-left: .75rem; padding: .25rem .75rem; border-radius: 99px; background: #fff; font: normal .72rem/1.2 var(--pp-font-body); color: var(--ppc-muted); }
.ppc-shop__body { position: relative; display: grid; gap: .9rem; padding: 1rem; }
.ppc-shop__nav { display: flex; align-items: center; gap: .6rem; }
.ppc-shop__nav b { width: 3.5rem; height: .8rem; border-radius: 4px; background: var(--ppc-deep-2); }
.ppc-shop__nav > span { width: 2.2rem; height: .45rem; border-radius: 4px; background: var(--ppc-tint-2); }
.ppc-shop__basket { position: relative; margin-left: auto; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--ppc-tint); color: var(--ppc-deep-2); font-style: normal; }
.ppc-shop__basket .ppc-icon { width: 1rem; height: 1rem; }
.ppc-shop__basket sup {
	position: absolute; top: -.3rem; right: -.35rem; min-width: 1.05rem; height: 1.05rem; padding: 0 .2rem;
	display: grid; place-items: center; border-radius: 99px;
	background: var(--ppc-pop); color: #fff; font: 700 .62rem/1 var(--pp-font-body);
}
.ppc-shop__basket.is-bump { animation: ppc-bump .5s var(--ppc-ease); }
@keyframes ppc-bump { 40% { transform: scale(1.35) rotate(-8deg); } }

.ppc-shop__banner {
	position: relative; overflow: hidden; display: grid; gap: .45rem; align-content: center;
	height: 8.5rem; padding: 1.25rem; border-radius: 10px;
	background: linear-gradient(120deg, #2A1B3D, #7C29CE 60%, #C084FC);
}
.ppc-shop__banner > span { width: 55%; height: .8rem; border-radius: 4px; background: rgba(255,255,255,.92); }
.ppc-shop__banner > span + span { width: 38%; height: .5rem; background: rgba(255,255,255,.55); }
.ppc-shop__banner i { width: 5rem; height: 1.4rem; margin-top: .4rem; border-radius: 6px; background: #fff; }
.ppc-shop__shine {
	position: absolute; inset: 0;
	background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,.4) 50%, transparent 65%);
	transform: translateX(-100%);
	animation: ppc-shine 5s ease-in-out infinite 2s;
}
@keyframes ppc-shine { 0%, 55% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }

.ppc-shop__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; }
.ppc-shop__product {
	position: relative; display: grid; gap: .35rem; padding: .45rem; border-radius: 10px;
	border: 1px solid var(--ppc-line); background: #fff;
	transition: transform .3s var(--ppc-ease), box-shadow .3s, border-color .3s;
}
.ppc-shop__product b { position: relative; height: 4.2rem; border-radius: 7px; background: linear-gradient(135deg, #EFE7F6, #D8B4FE); overflow: hidden; }
.ppc-shop__product:nth-child(2) b { background: linear-gradient(135deg, #F3E8FF, #C084FC); }
.ppc-shop__product:nth-child(3) b { background: linear-gradient(135deg, #E9D5FF, #7C29CE); }
.ppc-shop__product b::after { content: ""; position: absolute; left: 50%; top: 50%; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: rgba(255,255,255,.65); transform: translate(-50%, -50%); }
.ppc-shop__product:nth-child(2) b::after { border-radius: 6px; transform: translate(-50%, -50%) rotate(45deg); }
.ppc-shop__product > span { height: .4rem; width: 80%; border-radius: 4px; background: var(--ppc-tint-2); }
.ppc-shop__product > span + span { width: 45%; background: var(--ppc-pop-lt); }
.ppc-shop__product u {
	justify-self: start; margin-top: .15rem; padding: .22rem .6rem; border-radius: 5px;
	background: var(--ppc-pop); color: #fff; text-decoration: none; font: 600 .62rem/1 var(--pp-font-body);
	transition: transform .2s, background .2s;
}
.ppc-shop__product.is-picked { transform: translateY(-4px); border-color: var(--ppc-pop-lt); box-shadow: 0 14px 24px -14px rgba(124, 41, 206, .6); }
.ppc-shop__product.is-picked u { transform: scale(.9); background: var(--ppc-deep-2); }

.ppc-shop__cursor {
	position: absolute; left: 0; top: 0; z-index: 3; pointer-events: none;
	transform: translate(78%, 300px);
	transition: transform 1s cubic-bezier(.65, 0, .35, 1), opacity .4s;
	filter: drop-shadow(0 4px 6px rgba(0,0,0,.35));
	opacity: 0;
}
.ppc-shop__cursor.is-ready { opacity: 1; }
.ppc-shop__cursor svg { display: block; }
.ppc-shop__cursor::after {
	content: ""; position: absolute; left: 0; top: 0; width: 2.2rem; height: 2.2rem; margin: -1.1rem 0 0 -1.1rem;
	border-radius: 50%; border: 2px solid var(--ppc-pop); opacity: 0; transform: scale(.2);
}
.ppc-shop__cursor.is-click::after { animation: ppc-ripple .55s ease-out; }
@keyframes ppc-ripple { 0% { opacity: 1; transform: scale(.2); } 100% { opacity: 0; transform: scale(1.4); } }

/* Floating glass cards */
.ppc-float {
	position: absolute; z-index: 2; display: flex; align-items: center; gap: .7rem;
	padding: .75rem 1rem; border-radius: 14px;
	background: rgba(30, 18, 48, .6);
	-webkit-backdrop-filter: blur(14px) saturate(150%); backdrop-filter: blur(14px) saturate(150%);
	border: 1px solid rgba(255, 255, 255, .16);
	box-shadow: 0 24px 48px -16px rgba(0, 0, 0, .6);
	color: #fff; font-size: .78rem; line-height: 1.3;
	transform: translateZ(var(--z, 60px));
	animation: ppc-pop-in .8s var(--ppc-ease) backwards, ppc-bob 7s ease-in-out infinite;
	animation-delay: var(--d, 0ms), calc(var(--d, 0ms) + 800ms);
}
@keyframes ppc-pop-in { from { opacity: 0; scale: .8; } }
@keyframes ppc-bob { 50% { translate: 0 -10px; } }
.ppc-float strong { display: block; font-size: .9rem; }
.ppc-float small { color: rgba(255,255,255,.65); font-size: .72rem; }
.ppc-float .ppc-icon { width: 2rem; height: 2rem; padding: .4rem; border-radius: 9px; background: rgba(192,132,252,.18); color: var(--ppc-pop-lt); }

.ppc-float--badge { top: .5rem; left: -.5rem; }

.ppc-float--chart { top: 34%; right: -1.25rem; display: block; width: 13.5rem; padding: .9rem 1rem .6rem; }
.ppc-float--chart p { margin: 0 0 .4rem; }
.ppc-float--chart strong span { color: var(--ppc-pop-lt); }
.ppc-float--chart svg { display: block; width: 100%; height: 3.6rem; overflow: visible; }
.ppc-chart__line { fill: none; stroke: #C084FC; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 260; animation: ppc-chart 1.6s var(--ppc-ease) backwards 1.6s; }
.ppc-chart__area { animation: ppc-fade-in 1s ease backwards 2.4s; }
.ppc-chart__dot { fill: #fff; stroke: #C084FC; stroke-width: 3; transform-box: fill-box; transform-origin: center; animation: ppc-dot 2s ease-in-out infinite 3s; }
@keyframes ppc-chart { from { stroke-dashoffset: 260; } }
@keyframes ppc-fade-in { from { opacity: 0; } }
@keyframes ppc-dot { 50% { transform: scale(1.5); } }

.ppc-float--toast {
	bottom: 7.5rem; left: -2.25rem;
	opacity: 0; translate: -24px 0; animation: none;
	transition: opacity .45s var(--ppc-ease), translate .45s var(--ppc-ease);
}
.ppc-float--toast.is-show { opacity: 1; translate: 0 0; }
.ppc-float__tick { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--ppc-pop); }
.ppc-float__tick .ppc-icon { width: 1rem; height: 1rem; padding: 0; background: none; color: #fff; stroke-width: 3; }

.ppc-float--regions { bottom: -1.75rem; right: 6%; gap: .85rem; }
.ppc-float--regions span { display: inline-flex; align-items: center; gap: .35rem; font-weight: 600; }
.ppc-float--regions i { position: relative; width: .5rem; height: .5rem; border-radius: 50%; background: var(--ppc-pop-lt); }
.ppc-float--regions i::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--ppc-pop-lt); animation: ppc-ping 2s cubic-bezier(0, 0, .2, 1) infinite; }
.ppc-float--regions span:nth-of-type(2) i::after { animation-delay: .6s; }
.ppc-float--regions span:nth-of-type(3) i::after { animation-delay: 1.2s; }

@media (max-width: 999px) {
	.ppc-stage { max-width: 34rem; margin-inline: auto; padding: 1rem 1rem 2.5rem; }
	.ppc-stage__tilt { transform: rotateY(-6deg) rotateX(4deg); }
}
@media (max-width: 599px) {
	.ppc-float--badge, .ppc-float--regions { display: none; }
	.ppc-float--chart { width: 10rem; right: -.5rem; top: 40%; }
	.ppc-float--toast { left: -.5rem; bottom: 2.5rem; }
}

/* Marquee */
.ppc-hero__marquee {
	margin-top: clamp(2.5rem, 4vw, 4rem); padding-block: 1.15rem; overflow: hidden;
	border-top: 1px solid rgba(255,255,255,.08);
	background: rgba(10, 5, 20, .35);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
	        mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}
.ppc-marquee__track { display: flex; width: max-content; animation: ppc-marquee 45s linear infinite; }
.ppc-hero__marquee:hover .ppc-marquee__track { animation-play-state: paused; }
.ppc-marquee__track ul { display: flex; gap: 2.5rem; margin: 0; padding: 0 2.5rem 0 0; list-style: none; }
.ppc-marquee__track li { display: flex; align-items: center; gap: 2.5rem; white-space: nowrap; font: 600 .85rem/1 var(--pp-font-body); letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.ppc-marquee__track li::after { content: "\2726"; color: var(--ppc-pop-lt); font-size: .7rem; }
@keyframes ppc-marquee { to { transform: translateX(-50%); } }

/* Motion off — everything rests in its finished state. */
@media (prefers-reduced-motion: reduce) {
	.ppc-hero *, .ppc-hero *::before, .ppc-hero *::after { animation: none !important; transition: none !important; }
	.ppc-float--toast { opacity: 1; translate: none; }
	.ppc-shop__cursor { opacity: 0; }
}

/* -------------------- Credentials strip -------------------- */
.ppc-creds { border-bottom: 1px solid var(--ppc-line); background: #fff; }
.ppc-creds__list {
	display: grid; gap: 1rem 2rem; margin: 0; padding: 1.75rem 0; list-style: none;
	grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}
.ppc-creds__list li { display: flex; align-items: center; gap: .8rem; }
.ppc-creds__list .ppc-icon { width: 2.6rem; height: 2.6rem; padding: .6rem; border-radius: 50%; background: var(--ppc-tint); color: var(--ppc-pop); }
.ppc-creds__list span { font-size: .85rem; color: var(--ppc-muted); line-height: 1.3; }
.ppc-creds__list strong { display: block; font: 700 1rem/1.25 var(--pp-font-display); color: var(--ppc-ink); }

/* -------------------- Stat card -------------------- */
.ppc-stat-card {
	padding: clamp(1.75rem, 3vw, 2.5rem); border-radius: var(--ppc-radius);
	background: var(--ppc-tint); border: 1px solid var(--ppc-line);
}
.ppc-stat-card__label { margin: 0 0 1.25rem; font: 700 1.25rem/1.2 var(--pp-font-display); }

/* -------------------- Platforms -------------------- */
.ppc-platforms { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.ppc-platform {
	display: flex; flex-direction: column;
	padding: 1.75rem; border-radius: var(--ppc-radius);
	background: #fff; border: 1px solid var(--ppc-line); box-shadow: var(--ppc-shadow);
	transition: transform .25s var(--ppc-ease), box-shadow .25s var(--ppc-ease), border-color .25s;
}
.ppc-platform:hover { transform: translateY(-4px); border-color: var(--ppc-pop-lt); box-shadow: 0 24px 40px -24px rgba(30,18,48,.4); }
.ppc-platform__mark {
	display: grid; place-items: center; width: 3.25rem; height: 3.25rem; margin-bottom: 1.25rem;
	border-radius: var(--ppc-radius-sm);
	background: linear-gradient(135deg, var(--ppc-deep-2), var(--ppc-pop));
	color: #fff; font: 800 1.15rem/1 var(--pp-font-display);
}
.ppc-platform__name { margin: 0 0 .5rem; font: 700 1.35rem/1.2 var(--pp-font-display); }
.ppc-platform__name a { color: var(--ppc-ink); }
.ppc-platform > p { margin: 0 0 1rem; color: var(--ppc-muted); font-size: .97rem; }
.ppc-platform__links { margin: 0 0 1.5rem; padding: 1rem 0 0; list-style: none; border-top: 1px solid var(--ppc-line); display: grid; gap: .35rem; }
.ppc-platform__links a { font-size: .92rem; color: var(--ppc-ink); }
.ppc-platform__links a::before { content: "\203A"; margin-right: .45rem; color: var(--ppc-pop); font-weight: 700; }
.ppc-platform__links a:hover { color: var(--ppc-pop); }
.ppc-platform__more { margin-top: auto; display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; color: var(--ppc-pop); }
.ppc-platform__more .ppc-icon { width: 1em; height: 1em; transition: transform .2s; }
.ppc-platform__more:hover .ppc-icon { transform: translateX(3px); }

/* -------------------- Band -------------------- */
.ppc-band { background: linear-gradient(110deg, var(--ppc-deep-2), var(--ppc-pop-dk)); color: #fff; }
.ppc-band__inner {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 3rem;
	padding-block: clamp(2.5rem, 2rem + 2vw, 3.5rem);
}
.ppc-band h2 { margin: 0 0 .5rem; color: #fff; font: 700 clamp(1.4rem, 1.2rem + 1vw, 2rem)/1.2 var(--pp-font-display); }
.ppc-band p { margin: 0; max-width: 42rem; color: rgba(255,255,255,.8); }

/* -------------------- Cards (case studies / blog) -------------------- */
.ppc-cards { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); }
.ppc-card {
	display: flex; flex-direction: column; overflow: hidden;
	border-radius: var(--ppc-radius); background: #fff; border: 1px solid var(--ppc-line); box-shadow: var(--ppc-shadow);
}
.ppc-card__media { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--ppc-tint-2); }
.ppc-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--ppc-ease); }
.ppc-card:hover .ppc-card__media img { transform: scale(1.04); }
.ppc-card__placeholder {
	display: grid; place-items: center; width: 100%; height: 100%; padding: 1rem;
	background: linear-gradient(135deg, var(--ppc-deep-2), var(--ppc-lilac));
	color: #fff; font: 700 1.25rem/1.2 var(--pp-font-display); text-align: center;
}
.ppc-card__body { display: flex; flex-direction: column; flex: 1; padding: 1.5rem; }
.ppc-card__meta { margin: 0 0 .4rem; font-size: .8rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ppc-lilac); }
.ppc-card__title { margin: 0 0 .6rem; font: 700 1.2rem/1.3 var(--pp-font-display); }
.ppc-card__title a { color: var(--ppc-ink); }
.ppc-card__title a:hover { color: var(--ppc-pop); }
.ppc-card__body > p { margin: 0 0 1rem; color: var(--ppc-muted); font-size: .95rem; }
.ppc-card__body .ppc-link { margin-top: auto; }

/* -------------------- Service rows -------------------- */
.ppc-row {
	display: grid; gap: clamp(2rem, 5vw, 5rem); align-items: center;
	grid-template-columns: 1fr;
}
.ppc-row + .ppc-row { margin-top: var(--ppc-section); }
@media (min-width: 900px) {
	.ppc-row { grid-template-columns: 1.1fr 1fr; }
	.ppc-row--flip .ppc-row__copy { order: 2; }
}
.ppc-row__copy .ppc-prose { margin-bottom: 1.75rem; }
.ppc-row__panel {
	position: relative; overflow: hidden;
	padding: clamp(1.75rem, 3vw, 2.5rem); border-radius: var(--ppc-radius);
	background: linear-gradient(150deg, var(--ppc-deep) 0%, var(--ppc-deep-2) 65%, var(--ppc-lilac) 150%);
	color: #fff;
}
.ppc-row__panel::after {
	content: ""; position: absolute; right: -4rem; top: -4rem;
	width: 14rem; height: 14rem; border-radius: 50%;
	background: radial-gradient(circle, rgba(192,132,252,.35), transparent 70%);
}
.ppc-row__icon { display: inline-grid; place-items: center; width: 3rem; height: 3rem; margin-bottom: 1rem; border-radius: var(--ppc-radius-sm); background: rgba(255,255,255,.1); color: var(--ppc-pop-lt); }
.ppc-row__panel-title { margin: 0 0 1rem; font: 700 1.2rem/1.2 var(--pp-font-display); }
.ppc-row__panel ul { position: relative; z-index: 1; margin: 0; padding: 0; list-style: none; display: grid; gap: .6rem; }
.ppc-row__panel a {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	padding: .9rem 1.1rem; border-radius: var(--ppc-radius-sm);
	background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
	color: #fff; font-weight: 500;
	transition: background .2s, border-color .2s;
}
.ppc-row__panel a .ppc-icon { width: 1rem; height: 1rem; color: var(--ppc-pop-lt); transition: transform .2s; }
.ppc-row__panel a:hover { background: rgba(255,255,255,.14); border-color: rgba(192,132,252,.6); color: #fff; }
.ppc-row__panel a:hover .ppc-icon { transform: translateX(3px); }

/* -------------------- Process steps -------------------- */
.ppc-steps {
	display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none;
	grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
	counter-reset: none;
}
.ppc-steps li {
	padding: 1.5rem; border-radius: var(--ppc-radius);
	background: #fff; border: 1px solid var(--ppc-line);
}
.ppc-steps span { display: block; margin-bottom: .75rem; font: 800 1.75rem/1 var(--pp-font-display); color: var(--ppc-pop-lt); }
.ppc-steps h3 { margin: 0 0 .4rem; font: 700 1.1rem/1.25 var(--pp-font-display); }
.ppc-steps p { margin: 0; font-size: .93rem; color: var(--ppc-muted); }

/* -------------------- Testimonials -------------------- */
.ppc-quotes { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); }
.ppc-quote {
	display: flex; flex-direction: column; margin: 0;
	padding: 2rem; border-radius: var(--ppc-radius);
	background: var(--ppc-tint); border: 1px solid var(--ppc-line);
}
.ppc-quote:first-child { background: var(--ppc-deep-2); border-color: var(--ppc-deep-2); color: #fff; }
.ppc-quote__stars { margin: 0 0 1rem; color: #F5B83D; letter-spacing: .15em; }
.ppc-quote blockquote { margin: 0 0 1.5rem; padding: 0; border: 0; }
.ppc-quote blockquote p { margin: 0; font-size: 1.05rem; line-height: 1.6; }
.ppc-quote figcaption { display: flex; align-items: center; gap: .8rem; margin-top: auto; }
.ppc-quote__avatar {
	display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%;
	background: var(--ppc-pop); color: #fff; font: 700 1rem/1 var(--pp-font-display);
}
.ppc-quote figcaption strong { display: block; }
.ppc-quote figcaption small { display: block; color: var(--ppc-muted); font-size: .85rem; }
.ppc-quote:first-child figcaption small { color: rgba(255,255,255,.7); }

/* -------------------- Hosting band -------------------- */
.ppc-hosting {
	padding-block: var(--ppc-section);
	background:
		radial-gradient(50rem 25rem at 100% 100%, rgba(147, 51, 234, .35), transparent 60%),
		var(--ppc-deep);
	color: #fff;
}
.ppc-hosting .ppc-heading__title em { color: var(--ppc-pop-lt); }
.ppc-hosting .ppc-eyebrow { color: var(--ppc-pop-lt); }
.ppc-hosting .ppc-prose p { color: rgba(255,255,255,.78); }
.ppc-hosting__grid { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
.ppc-hosting__grid li {
	padding: 1.35rem; border-radius: var(--ppc-radius);
	background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
}
.ppc-hosting__grid .ppc-icon { width: 1.6rem; height: 1.6rem; margin-bottom: .75rem; color: var(--ppc-pop-lt); }
.ppc-hosting__grid strong { display: block; margin-bottom: .2rem; font-family: var(--pp-font-display); }
.ppc-hosting__grid span { font-size: .88rem; color: rgba(255,255,255,.7); }

/* -------------------- Local -------------------- */
.ppc-local {
	display: grid; gap: 2rem; align-items: start;
	grid-template-columns: 1fr;
	max-width: 60rem;
}
@media (min-width: 700px) { .ppc-local { grid-template-columns: auto 1fr; } }
.ppc-local__pin {
	display: grid; place-items: center; width: 5rem; height: 5rem; border-radius: 50%;
	background: var(--ppc-tint); color: var(--ppc-pop);
}
.ppc-local__pin .ppc-icon { width: 2.2rem; height: 2.2rem; }
.ppc-local .ppc-prose { margin-bottom: 1.25rem; }

/* -------------------- FAQ -------------------- */
.ppc-faq { display: grid; gap: 2.5rem; grid-template-columns: 1fr; }
@media (min-width: 900px) { .ppc-faq { grid-template-columns: 1fr 1.6fr; gap: 4rem; } }
.ppc-faq__list { display: grid; gap: .75rem; }
.ppc-faq__item { border-radius: var(--ppc-radius); background: #fff; border: 1px solid var(--ppc-line); }
.ppc-faq__item[open] { border-color: var(--ppc-pop-lt); }
.ppc-faq__item summary {
	position: relative; padding: 1.15rem 3.25rem 1.15rem 1.35rem;
	list-style: none; cursor: pointer; font-weight: 600; font-size: 1.02rem;
}
.ppc-faq__item summary::-webkit-details-marker { display: none; }
.ppc-faq__item summary::after {
	content: "+"; position: absolute; right: 1.1rem; top: 50%; transform: translateY(-50%);
	display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border-radius: 50%;
	background: var(--ppc-tint); color: var(--ppc-pop); font-size: 1.2rem; line-height: 1;
}
.ppc-faq__item[open] summary::after { content: "\2212"; background: var(--ppc-pop); color: #fff; }
.ppc-faq__answer { padding: 0 1.35rem 1.25rem; }
.ppc-faq__answer p { margin: 0; color: var(--ppc-muted); }

/* -------------------- Closing CTA -------------------- */
.ppc-cta {
	padding-block: var(--ppc-section);
	background:
		radial-gradient(40rem 20rem at 50% 0%, rgba(192, 132, 252, .4), transparent 70%),
		linear-gradient(160deg, var(--ppc-deep-2), var(--ppc-deep));
	color: #fff; text-align: center;
}
.ppc-cta__inner { max-width: 46rem; }
.ppc-cta h2 { margin: 0; color: #fff; font: 800 clamp(2rem, 1.5rem + 2.5vw, 3.25rem)/1.1 var(--pp-font-display); letter-spacing: -.02em; }
.ppc-cta h2 em { font-style: normal; color: var(--ppc-pop-lt); }
.ppc-cta p:not(.ppc-eyebrow) { margin: 1rem auto 0; max-width: 34rem; font-size: 1.1rem; color: rgba(255,255,255,.8); }

/* -------------------- Footer -------------------- */
.ppc-footer { background: var(--ppc-ink); color: rgba(255,255,255,.72); font-size: .95rem; }
.ppc-footer a { color: rgba(255,255,255,.8); }
.ppc-footer a:hover { color: #fff; }
.ppc-footer__top {
	display: grid; gap: 2.5rem; padding-block: 4rem 3rem;
	grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
}
@media (min-width: 1000px) { .ppc-footer__top { grid-template-columns: 1.6fr repeat(4, 1fr); } }
.ppc-footer__brand { grid-column: 1 / -1; }
@media (min-width: 1000px) { .ppc-footer__brand { grid-column: auto; } }
.ppc-footer__brand img { max-height: 3.5rem; width: auto; filter: brightness(0) invert(1); }
.ppc-footer__pitch { margin: 1.25rem 0; max-width: 22rem; }
.ppc-footer__addr { display: grid; gap: .6rem; font-style: normal; }
.ppc-footer__addr > * { display: flex; gap: .6rem; align-items: flex-start; }
.ppc-footer__addr .ppc-icon { width: 1.05rem; height: 1.05rem; margin-top: .2rem; color: var(--ppc-pop-lt); }
.ppc-footer__col h2 { margin: 0 0 1rem; color: #fff; font: 700 1rem/1.2 var(--pp-font-display); }
.ppc-footer__col ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .55rem; }

.ppc-footer__creds {
	display: flex; flex-wrap: wrap; gap: .75rem; margin: 0; padding: 1.75rem 0; list-style: none;
	border-top: 1px solid rgba(255,255,255,.1);
}
.ppc-footer__creds li {
	display: inline-flex; align-items: center; gap: .5rem;
	padding: .55rem .95rem; border-radius: 99px;
	border: 1px solid rgba(255,255,255,.15); font-size: .85rem; color: #fff;
}
.ppc-footer__creds .ppc-icon { width: 1rem; height: 1rem; color: var(--ppc-pop-lt); }

.ppc-footer__bottom {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem;
	padding-block: 1.5rem 2rem; border-top: 1px solid rgba(255,255,255,.1); font-size: .85rem;
}
.ppc-footer__bottom p { margin: 0; }
.ppc-footer__legal, .ppc-footer__social { display: flex; flex-wrap: wrap; gap: 1.25rem; margin: 0; padding: 0; list-style: none; }

/* -------------------- Inner pages (parent templates) -------------------- */
.ppc .pp-page-header {
	padding-block: clamp(3rem, 2rem + 4vw, 5.5rem);
	background:
		radial-gradient(50rem 25rem at 90% 0%, rgba(147, 51, 234, .45), transparent 60%),
		var(--ppc-deep);
	color: #fff;
}
.ppc .pp-page-header__title { color: #fff; letter-spacing: -.02em; }
.ppc .pp-page-header__lead { color: rgba(255,255,255,.8); }
.ppc .pp-page-header .pp-breadcrumbs,
.ppc .pp-page-header .pp-breadcrumbs a { color: rgba(255,255,255,.7); }
.ppc .pp-page-header .pp-eyebrow { color: var(--ppc-pop-lt); }
.ppc .pp-section--bg-cream { background: #fff; }

/* -------------------- AI -------------------- */
.ppc-ai {
	position: relative; overflow: hidden; isolation: isolate;
	padding-block: var(--ppc-section);
	background: #160C24; color: #fff;
}
.ppc-ai__bg {
	position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background:
		radial-gradient(40rem 26rem at 85% 20%, rgba(124, 41, 206, .45), transparent 60%),
		radial-gradient(34rem 24rem at 5% 90%, rgba(168, 85, 247, .25), transparent 60%);
}
.ppc-ai__bg::after {
	content: ""; position: absolute; inset: 0;
	background-image: radial-gradient(rgba(192, 132, 252, .22) 1px, transparent 1px);
	background-size: 28px 28px;
	-webkit-mask-image: radial-gradient(ellipse at 70% 30%, #000, transparent 70%);
	        mask-image: radial-gradient(ellipse at 70% 30%, #000, transparent 70%);
}
.ppc-ai .ppc-eyebrow { color: var(--ppc-pop-lt); }
.ppc-ai .ppc-heading__title em {
	background: linear-gradient(90deg, #C084FC, #F5D0FE, #A855F7, #C084FC);
	background-size: 300% 100%;
	-webkit-background-clip: text; background-clip: text; color: transparent;
	animation: ppc-shimmer 6s linear infinite;
}
.ppc-ai .ppc-prose p { color: rgba(255, 255, 255, .78); }

/* Demo chat */
.ppc-chat {
	position: relative; max-width: 30rem; margin-inline: auto; width: 100%;
	border-radius: 18px; overflow: hidden;
	background: rgba(30, 18, 48, .7);
	-webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
	border: 1px solid rgba(255, 255, 255, .14);
	box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .7), 0 0 70px -20px rgba(147, 51, 234, .55);
}
.ppc-chat::before {
	content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none;
	background: conic-gradient(from var(--ppc-ang), transparent 0 70%, #C084FC 85%, transparent);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor; mask-composite: exclude;
	animation: ppc-spin 6s linear infinite;
}
.ppc-chat__head {
	display: flex; align-items: center; gap: .75rem;
	padding: 1rem 1.25rem; border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.ppc-chat__avatar {
	display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%;
	background: linear-gradient(135deg, var(--ppc-pop), var(--ppc-pop-lt)); color: #fff;
}
.ppc-chat__avatar .ppc-icon { width: 1.2rem; height: 1.2rem; }
.ppc-chat__head strong { display: block; font-size: .95rem; }
.ppc-chat__head small { display: inline-flex; align-items: center; gap: .35rem; font-size: .75rem; color: rgba(255, 255, 255, .6); }
.ppc-chat__head small i { width: .45rem; height: .45rem; border-radius: 50%; background: var(--ppc-pop-lt); box-shadow: 0 0 8px var(--ppc-pop-lt); }

.ppc-chat__body { display: flex; flex-direction: column; gap: .65rem; min-height: 19rem; padding: 1.25rem; }
.ppc-msg {
	max-width: 85%; padding: .7rem .95rem; border-radius: 16px;
	font-size: .9rem; line-height: 1.45;
}
.ppc-msg--user { align-self: flex-end; border-bottom-right-radius: 4px; background: var(--ppc-pop); color: #fff; }
.ppc-msg--bot  { align-self: flex-start; border-bottom-left-radius: 4px; background: rgba(255, 255, 255, .09); border: 1px solid rgba(255, 255, 255, .1); color: rgba(255, 255, 255, .92); }
.ppc-msg__product {
	display: flex; align-items: center; gap: .65rem; margin-top: .6rem; padding: .5rem;
	border-radius: 10px; background: #fff; color: var(--ppc-ink);
}
.ppc-msg__product b { flex: none; width: 2.6rem; height: 2.6rem; border-radius: 8px; background: linear-gradient(135deg, #7C29CE, #C084FC); }
.ppc-msg__product strong { display: block; font-size: .85rem; }
.ppc-msg__product small { font-size: .72rem; color: var(--ppc-muted); }
.ppc-msg--typing { display: none; align-self: flex-start; gap: .3rem; background: rgba(255, 255, 255, .09); border-bottom-left-radius: 4px; }
.ppc-msg--typing span { width: .45rem; height: .45rem; border-radius: 50%; background: rgba(255, 255, 255, .7); animation: ppc-typing 1.2s ease-in-out infinite; }
.ppc-msg--typing span:nth-child(2) { animation-delay: .15s; }
.ppc-msg--typing span:nth-child(3) { animation-delay: .3s; }
@keyframes ppc-typing { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-4px); opacity: 1; } }

/* JS plays the conversation; without it every message just shows. */
.ppc-chat.is-live .ppc-msg:not(.ppc-msg--typing) { display: none; }
.ppc-chat.is-live .ppc-msg.is-in { display: block; animation: ppc-msg-in .45s var(--ppc-ease); }
.ppc-chat.is-live .ppc-msg--typing.is-in { display: inline-flex; }
.ppc-chat.is-fading .ppc-chat__body { opacity: 0; transition: opacity .5s; }
@keyframes ppc-msg-in { from { opacity: 0; transform: translateY(10px) scale(.96); } }

.ppc-chat__input {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	margin: 0 1.25rem 1.25rem; padding: .7rem .7rem .7rem 1rem; border-radius: 12px;
	background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1);
	font-size: .85rem; color: rgba(255, 255, 255, .5);
}
.ppc-chat__input b { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 8px; background: var(--ppc-pop); color: #fff; }
.ppc-chat__input .ppc-icon { width: 1rem; height: 1rem; }

/* Capability cards */
.ppc-ai__grid {
	display: grid; gap: 1rem; margin-top: clamp(3rem, 5vw, 4.5rem);
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr));
}
.ppc-ai__card {
	position: relative; padding: 1.6rem; border-radius: var(--ppc-radius);
	background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .1);
	transition: transform .3s var(--ppc-ease), border-color .3s, background .3s;
}
.ppc-ai__card:hover { transform: translateY(-4px); border-color: rgba(192, 132, 252, .55); background: rgba(192, 132, 252, .08); }
.ppc-ai__icon {
	display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem; margin-bottom: 1rem;
	border-radius: 10px; background: rgba(192, 132, 252, .14); color: var(--ppc-pop-lt);
}
.ppc-ai__card h3 { margin: 0 0 .45rem; color: #fff; font: 700 1.15rem/1.25 var(--pp-font-display); }
.ppc-ai__card p { margin: 0; font-size: .94rem; color: rgba(255, 255, 255, .7); }

/* Cards rise in as the section scrolls into view. */
.ppc-ai.is-armed .ppc-ai__card { opacity: 0; transform: translateY(24px); }
.ppc-ai.is-armed.is-seen .ppc-ai__card {
	opacity: 1; transform: none;
	transition: opacity .7s var(--ppc-ease), transform .7s var(--ppc-ease), border-color .3s, background .3s;
	transition-delay: calc(var(--i) * 80ms), calc(var(--i) * 80ms), 0s, 0s;
}

@media (prefers-reduced-motion: reduce) {
	.ppc-ai *, .ppc-ai *::before, .ppc-ai *::after { animation: none !important; }
}

/* -------------------- Hero slides -------------------- */
.ppc-hero__slides { display: grid; }
.ppc-hero__slide {
	grid-area: 1 / 1; min-width: 0;
	visibility: hidden; pointer-events: none;
	transition: visibility 0s linear .8s;
}
.ppc-hero__slide.is-active { visibility: visible; pointer-events: auto; transition: none; }
.ppc-hero__slide.is-leaving { visibility: visible; }

/* Entrance animations only run on the live slide, so they replay each time it comes back. */
.ppc-hero__slide:not(.is-active) *,
.ppc-hero__slide:not(.is-active) *::before,
.ppc-hero__slide:not(.is-active) *::after { animation: none !important; }

.ppc-hero__slide .ppc-hero__copy,
.ppc-hero__slide .ppc-stage { transition: opacity .7s var(--ppc-ease), transform .8s var(--ppc-ease), filter .7s var(--ppc-ease); }
.ppc-hero__slide:not(.is-active) .ppc-hero__copy { opacity: 0; transform: translateY(-28px); filter: blur(10px); }
.ppc-hero__slide:not(.is-active) .ppc-stage { opacity: 0; transform: translateX(-8%) rotateY(30deg) scale(.88); filter: blur(8px); }

/* Light sweep across the hero on slide change */
.ppc-hero__sweep {
	position: absolute; inset: -20% -60%;
	background: linear-gradient(105deg, transparent 40%, rgba(192, 132, 252, .22) 48%, rgba(245, 208, 254, .35) 50%, rgba(192, 132, 252, .22) 52%, transparent 60%);
	transform: translateX(-100%); opacity: 0;
}
.ppc-hero__sweep.is-on { animation: ppc-sweep 1.1s cubic-bezier(.65, 0, .35, 1); }
@keyframes ppc-sweep { 0% { transform: translateX(-60%); opacity: 1; } 100% { transform: translateX(60%); opacity: 0; } }

/* Slide picker with progress */
.ppc-hero__nav { position: relative; z-index: 2; margin-top: clamp(1.5rem, 3vw, 2.5rem); }
.ppc-hero__dots { display: flex; flex-wrap: wrap; gap: .6rem; }
.ppc-hero__dots button {
	position: relative; overflow: hidden;
	padding: .55rem 1rem .7rem; min-width: 9.5rem; text-align: left;
	border: 1px solid rgba(255, 255, 255, .14); border-radius: 10px;
	background: rgba(255, 255, 255, .04); color: rgba(255, 255, 255, .6);
	font: 600 .82rem/1.2 var(--pp-font-body); cursor: pointer;
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	transition: color .2s, border-color .2s, background .2s;
}
.ppc-hero__dots button:hover { color: #fff; border-color: rgba(255, 255, 255, .3); }
.ppc-hero__dots button.is-active { color: #fff; border-color: rgba(192, 132, 252, .55); background: rgba(192, 132, 252, .1); }
.ppc-hero__dots i { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: rgba(255, 255, 255, .08); }
.ppc-hero__dots i::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(90deg, var(--ppc-pop), var(--ppc-pop-lt));
	transform-origin: left; transform: scaleX(var(--p, 0));
}
.ppc-hero__dots button:not(.is-active) i::after { transform: scaleX(0); }

/* -------------------- Slide 2: app mock -------------------- */
.ppc-app {
	position: relative; border-radius: 14px; overflow: hidden;
	background: #fff; color: var(--ppc-ink);
	box-shadow: 0 60px 120px -30px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .12), 0 0 80px -10px rgba(147, 51, 234, .45);
}
.ppc-app__body { display: grid; grid-template-columns: 3.25rem 1fr; min-height: 19rem; }
.ppc-app__side { display: flex; flex-direction: column; align-items: center; gap: .8rem; padding: 1rem 0; background: var(--ppc-deep-2); }
.ppc-app__side b { width: 1.5rem; height: 1.5rem; margin-bottom: .4rem; border-radius: 7px; background: linear-gradient(135deg, var(--ppc-pop), var(--ppc-pop-lt)); }
.ppc-app__side i { width: 1.4rem; height: .4rem; border-radius: 4px; background: rgba(255, 255, 255, .2); }
.ppc-app__side i.is-on { background: var(--ppc-pop-lt); }
.ppc-app__main { position: relative; padding: 1rem 1.1rem; display: grid; gap: .7rem; align-content: start; }
.ppc-app__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.ppc-app__head strong { display: block; font: 700 .95rem/1.2 var(--pp-font-display); }
.ppc-app__head small { font-size: .72rem; color: var(--ppc-muted); }
.ppc-app__ai {
	display: inline-flex; align-items: center; gap: .35rem;
	padding: .4rem .7rem; border-radius: 8px;
	background: linear-gradient(135deg, var(--ppc-pop), #A855F7); color: #fff;
	font: 600 .7rem/1 var(--pp-font-body); font-style: normal;
	box-shadow: 0 6px 16px -6px rgba(147, 51, 234, .7);
	transition: transform .2s, box-shadow .3s;
}
.ppc-app__ai .ppc-icon { width: .85rem; height: .85rem; }
.ppc-app__ai.is-pressed { transform: scale(.92); box-shadow: 0 0 0 6px rgba(192, 132, 252, .35); }
.ppc-app__progress { height: 4px; border-radius: 99px; background: var(--ppc-tint-2); overflow: hidden; }
.ppc-app__progress i { display: block; height: 100%; width: 100%; transform-origin: left; transform: scaleX(var(--p, 0)); background: linear-gradient(90deg, var(--ppc-pop), var(--ppc-pop-lt)); transition: transform .5s var(--ppc-ease); }
.ppc-app__rows { margin: 0; padding: 0; list-style: none; display: grid; gap: .4rem; }
.ppc-app__rows li {
	display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .6rem;
	padding: .5rem .6rem; border-radius: 8px; border: 1px solid var(--ppc-line);
	font-size: .72rem; transition: background .3s, border-color .3s;
}
.ppc-app__file { display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 6px; background: var(--ppc-tint); color: var(--ppc-lilac); }
.ppc-app__file .ppc-icon { width: .8rem; height: .8rem; }
.ppc-app__name { display: grid; gap: .25rem; font-weight: 600; }
.ppc-app__name i { display: block; width: 55%; height: .3rem; border-radius: 3px; background: var(--ppc-tint-2); }
.ppc-app__pill {
	padding: .25rem .55rem; border-radius: 99px; white-space: nowrap;
	background: var(--ppc-tint); color: var(--ppc-muted); font-weight: 600; font-size: .64rem;
}
.ppc-app__rows li.is-reading { background: #FAF5FF; border-color: rgba(192, 132, 252, .5); }
.ppc-app__rows li.is-reading .ppc-app__pill {
	background: linear-gradient(90deg, #E9D5FF, #F5D0FE, #E9D5FF); background-size: 200% 100%;
	color: var(--ppc-pop-dk); animation: ppc-shimmer 1s linear infinite;
}
.ppc-app__rows li.is-done .ppc-app__pill { background: var(--ppc-pop); color: #fff; }
.ppc-app__rows li.is-done .ppc-app__name i { background: var(--ppc-pop-lt); }

/* Code float */
.ppc-float--code { top: -1.75rem; right: -1.5rem; display: block; padding: .85rem 1rem; }
.ppc-float--code code { display: grid; gap: .2rem; font: 500 .72rem/1.45 var(--pp-font-mono); color: rgba(255, 255, 255, .85); white-space: nowrap; }
.ppc-float--code code > span { overflow: hidden; clip-path: inset(0 0 0 0); animation: ppc-type 1s steps(28) backwards; animation-delay: calc(1.8s + var(--l) * 1s); }
.ppc-float--code b { color: var(--ppc-pop-lt); font-weight: 600; }
.ppc-float--code s { text-decoration: none; color: #F5D0FE; }
.ppc-float--code em { display: inline-block; width: .45rem; height: .85rem; margin-left: .15rem; vertical-align: -.1rem; background: var(--ppc-pop-lt); animation: ppc-caret 1s steps(1) infinite; }
@keyframes ppc-type { from { clip-path: inset(0 100% 0 0); } }
@keyframes ppc-caret { 50% { opacity: 0; } }

.ppc-float--secure { bottom: -1.75rem; right: 6%; }

@media (max-width: 599px) {
	.ppc-float--secure, .ppc-float--code { display: none; }
	.ppc-hero__dots button { min-width: 0; flex: 1; }
}
@media (prefers-reduced-motion: reduce) {
	.ppc-hero__slide .ppc-hero__copy, .ppc-hero__slide .ppc-stage { transition: none; }
}

/* =========================================================================
   Site-wide effects (classes are added by commerce.js, so without JS —
   or with reduced motion — everything simply shows as normal).
   ========================================================================= */

/* Scroll progress under the header */
.ppc-progress {
	position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; pointer-events: none;
	background: linear-gradient(90deg, var(--ppc-pop), var(--ppc-pop-lt), #F5D0FE);
	transform-origin: left; transform: scaleX(var(--p, 0));
}

/* Scroll reveal */
.ppc-reveal {
	opacity: 0; transform: translateY(28px); filter: blur(6px);
	transition: opacity .8s var(--ppc-ease), transform .9s var(--ppc-ease), filter .8s var(--ppc-ease);
	transition-delay: calc(var(--ri, 0) * 70ms);
}
.ppc-reveal.is-in { opacity: 1; transform: none; filter: none; }

/* Heading squiggles draw on */
.ppc-draw::after { clip-path: inset(0 100% 0 0); transition: clip-path 1.1s var(--ppc-ease) .35s; }
.ppc-draw.is-drawn::after { clip-path: inset(0 0 0 0); }

/* Process line */
.ppc-steps--draw { position: relative; }
.ppc-steps--draw::before {
	content: ""; position: absolute; left: 1.5rem; right: 1.5rem; top: 2.35rem; height: 2px; z-index: 0;
	background: linear-gradient(90deg, var(--ppc-pop), var(--ppc-pop-lt));
	transform-origin: left; transform: scaleX(0);
	transition: transform 1.6s var(--ppc-ease) .2s;
}
.ppc-steps--draw.is-drawn::before { transform: scaleX(1); }
.ppc-steps--draw li { position: relative; z-index: 1; }
@media (max-width: 899px) { .ppc-steps--draw::before { display: none; } }

/* Card spotlight */
.ppc-glow { position: relative; isolation: isolate; }
.ppc-glow__fx {
	position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: -1;
	opacity: 0; transition: opacity .35s;
	background: radial-gradient(22rem circle at var(--gx, 50%) var(--gy, 50%), rgba(147, 51, 234, .12), transparent 45%);
}
.ppc-glow__fx::before {
	content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
	background: radial-gradient(16rem circle at var(--gx, 50%) var(--gy, 50%), rgba(147, 51, 234, .75), transparent 50%);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor; mask-composite: exclude;
}
.ppc-glow:hover .ppc-glow__fx { opacity: 1; }
/* Brighter glow on dark cards */
.ppc-row__panel .ppc-glow__fx, .ppc-row__panel.ppc-glow > .ppc-glow__fx,
.ppc-hosting__grid .ppc-glow__fx, .ppc-ai__card .ppc-glow__fx, .ppc-quote:first-child .ppc-glow__fx {
	background: radial-gradient(22rem circle at var(--gx, 50%) var(--gy, 50%), rgba(192, 132, 252, .2), transparent 45%);
}
.ppc-hosting__grid .ppc-glow__fx::before, .ppc-ai__card .ppc-glow__fx::before, .ppc-row__panel .ppc-glow__fx::before, .ppc-quote:first-child .ppc-glow__fx::before {
	background: radial-gradient(16rem circle at var(--gx, 50%) var(--gy, 50%), rgba(233, 213, 255, .9), transparent 50%);
}
.ppc-row__panel.ppc-glow::after { z-index: -1; }

/* 3D tilt */
.ppc-tilt { transition: transform .5s var(--ppc-ease), box-shadow .3s, border-color .3s, background .3s; }
.ppc-tilt.is-tilting {
	transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-4px);
	transition: transform .12s linear, box-shadow .3s, border-color .3s, background .3s;
}

/* Magnetic buttons + shine on hover */
.ppc-magnet { transition: translate .35s var(--ppc-ease), background .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s; }
.ppc-btn--primary, .ppc .pp-btn--primary { position: relative; overflow: hidden; }
.ppc-btn--primary::after, .ppc .pp-btn--primary::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .45) 50%, transparent 70%);
	transform: translateX(-120%);
}
.ppc-btn--primary:hover::after, .ppc .pp-btn--primary:hover::after { transform: translateX(120%); transition: transform .8s var(--ppc-ease); }

/* Particle background in dark bands + inner-page headers */
.ppc-fxhost { position: relative; isolation: isolate; overflow: hidden; }
.ppc-fx { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.ppc-fx canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .8; }
.ppc-fx__spot { position: absolute; inset: 0; background: radial-gradient(34rem circle at var(--sx, 70%) var(--sy, 30%), rgba(192, 132, 252, .16), transparent 60%); }

/* Inner-page title words */
.ppc-word { display: inline-block; animation: ppc-word 1s var(--ppc-ease) backwards; animation-delay: calc(var(--i) * 80ms + 100ms); }

@media (prefers-reduced-motion: reduce) {
	.ppc-reveal { opacity: 1; transform: none; filter: none; transition: none; }
	.ppc-draw::after { clip-path: none; }
	.ppc-word { animation: none; }
}

/* =========================================================================
   SITE-WIDE WOW PASS
   ========================================================================= */

/* -------------------- Page banners (every inner page) --------------------
   No stock photos: the same aurora / grid / particles as the homepage hero,
   plus a 3D orbit with the page's icon (injected by commerce.js). */
.ppc .pp-page-header,
.ppc .pp-hero--about,
.ppc .pp-hero--location {
	position: relative; overflow: hidden; isolation: isolate;
	display: flex; align-items: center;
	min-height: clamp(16rem, 11rem + 11vw, 24rem);
	padding-block: clamp(2.25rem, 1.5rem + 2.5vw, 3.75rem);
	background: var(--b-bg, #160C24); color: var(--b-text, #fff);
}
.ppc .pp-page-header__title, .ppc .pp-hero__title { font-size: clamp(2.3rem, 1.5rem + 2.6vw, 3.75rem) !important; line-height: 1.04; margin-block: .35rem .6rem; }
.ppc .pp-page-header__lead, .ppc .pp-hero__lead { font-size: clamp(1rem, .95rem + .3vw, 1.15rem); margin-top: .4rem; }
.ppc .pp-page-header__ctas, .ppc .pp-hero__ctas { margin-top: 1.25rem; }
.ppc .pp-page-header__icon { width: 4rem !important; height: 4rem !important; }
.ppc .pp-page-header__icon svg { width: 1.9rem; height: 1.9rem; }
.ppc .pp-page-header > .pp-container,
.ppc .pp-hero--about > .pp-container,
.ppc .pp-hero--location > .pp-container { position: relative; z-index: 2; width: 100%; }

/* Retire the photo + the parent's yellow/coral washes. */
.ppc .pp-page-header::before,
.ppc .pp-hero--about::before,
.ppc .pp-hero--location::before { background: none !important; opacity: 0 !important; }
.ppc .pp-hero__bg { display: none; }

/* Glowing line along the bottom edge */
.ppc .pp-page-header::after,
.ppc .pp-hero--about::after,
.ppc .pp-hero--location::after {
	content: ""; position: absolute; left: 0; right: 0; top: auto; bottom: 0; height: 1px; z-index: 3;
	background: linear-gradient(90deg, transparent, rgba(192, 132, 252, .9), #F5D0FE, rgba(192, 132, 252, .9), transparent) !important;
	background-size: 200% 100% !important; opacity: 1 !important;
	animation: ppc-edge 6s linear infinite;
}
@keyframes ppc-edge { to { background-position: -200% 0; } }

/* Effect stack (same recipe as the hero) */
.ppc-bfx { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.ppc-bfx .ppc-hero__aurora span:nth-child(1) { width: 40rem; height: 28rem; top: -14rem; right: -8rem; }
.ppc-bfx .ppc-hero__aurora span:nth-child(2) { width: 32rem; height: 24rem; bottom: -16rem; left: -10rem; }
.ppc-bfx .ppc-hero__aurora span:nth-child(3) { width: 22rem; height: 18rem; top: 20%; left: 45%; }
.ppc-bfx .ppc-hero__floor { height: 70%; opacity: .7; }

/* Text sits left of the orbit on wide screens */
@media (min-width: 1100px) {
	.ppc-banner--orbit .pp-page-header__title,
	.ppc-banner--orbit .pp-hero__title,
	.ppc-banner--orbit .pp-page-header__lead,
	.ppc-banner--orbit .pp-hero__lead { max-width: min(42rem, 58%); }
	.ppc-banner--orbit .pp-page-header__layout { max-width: 64%; }
}

/* Entrance */
.ppc .pp-breadcrumbs,
.ppc .pp-page-header__icon,
.ppc .pp-page-header__lead, .ppc .pp-hero__lead,
.ppc .pp-page-header__ctas, .ppc .pp-hero__ctas,
.ppc .pp-page-header__meta { animation: ppc-rise .9s var(--ppc-ease) backwards; }
.ppc .pp-breadcrumbs { animation-delay: 50ms; }
.ppc .pp-page-header__icon { animation-delay: 150ms; }
.ppc .pp-page-header__lead, .ppc .pp-hero__lead { animation-delay: 550ms; }
.ppc .pp-page-header__ctas, .ppc .pp-hero__ctas, .ppc .pp-page-header__meta { animation-delay: 700ms; }

.ppc .pp-page-header__title, .ppc .pp-hero__title { color: #fff; letter-spacing: -.03em; text-wrap: balance; }
.ppc .pp-page-header__lead, .ppc .pp-hero__lead { color: rgba(255, 255, 255, .8); }
.ppc .pp-breadcrumbs, .ppc .pp-breadcrumbs a, .ppc .pp-breadcrumbs li { color: rgba(255, 255, 255, .65); }
.ppc .pp-breadcrumbs a:hover { color: #fff; }
.ppc .pp-breadcrumbs [aria-current] { color: #fff; }
.ppc .pp-hero--location .pp-hero__title span,
.ppc .pp-hero__title-mark { color: var(--ppc-pop-lt); }

/* Glass icon tile on service banners */
.ppc .pp-page-header__icon {
	background: rgba(255, 255, 255, .07) !important; border: 1px solid rgba(255, 255, 255, .16);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	color: var(--ppc-pop-lt) !important; box-shadow: 0 0 40px -8px rgba(192, 132, 252, .6);
}

/* Visible ghost buttons on dark banners */
.ppc .pp-page-header .pp-btn--ghost,
.ppc .pp-hero .pp-btn--ghost,
.ppc .pp-cta-band .pp-btn--ghost {
	color: #fff !important; border: 2px solid rgba(255, 255, 255, .35) !important; background: transparent !important;
}
.ppc .pp-page-header .pp-btn--ghost:hover,
.ppc .pp-hero .pp-btn--ghost:hover { border-color: #fff !important; background: rgba(255, 255, 255, .08) !important; }

/* Last word of the title: shimmering gradient + squiggle that draws on */
.ppc-word--grad {
	position: relative;
	background: linear-gradient(90deg, #C084FC, #F5D0FE, #A855F7, #E9D5FF, #C084FC);
	background-size: 300% 100%;
	-webkit-background-clip: text; background-clip: text; color: transparent;
	animation: ppc-word 1s var(--ppc-ease) backwards, ppc-shimmer 6s linear infinite;
	animation-delay: calc(var(--i) * 80ms + 100ms), 0s;
	padding-bottom: .06em;
}
.ppc-word__squiggle {
	position: absolute; left: 0; bottom: -.12em; width: 100%; height: .22em; overflow: visible;
	fill: none; stroke: var(--ppc-pop); stroke-width: 5; stroke-linecap: round;
	stroke-dasharray: 320; animation: ppc-draw 1.2s var(--ppc-ease) backwards 1s;
}

/* The orbit */
.ppc-orbit {
	position: absolute; z-index: 1; top: 50%; right: max(2rem, calc((100vw - var(--pp-container, 1240px)) / 2 + 1rem));
	width: clamp(13rem, 19vw, 19rem); aspect-ratio: 1;
	transform: translateY(-50%); perspective: 1000px; pointer-events: none;
	animation: ppc-orbit-in 1.4s var(--ppc-ease) backwards .2s;
}
@keyframes ppc-orbit-in { from { opacity: 0; transform: translateY(-46%) scale(.85); filter: blur(10px); } }
@media (max-width: 1099px) { .ppc-orbit { display: none; } }
.ppc-orbit__tilt {
	position: absolute; inset: 0; transform-style: preserve-3d;
	transform: rotateX(calc(var(--my, 0) * -10deg)) rotateY(calc(var(--mx, 0) * 14deg));
	transition: transform .6s cubic-bezier(.2, .8, .2, 1);
}
.ppc-orbit__glow {
	position: absolute; inset: 22%; border-radius: 50%;
	background: radial-gradient(circle, rgba(168, 85, 247, .55), transparent 65%);
	filter: blur(30px); animation: ppc-breathe 5s ease-in-out infinite;
}
@keyframes ppc-breathe { 50% { transform: scale(1.18); opacity: .7; } }
.ppc-orbit__ring { position: absolute; inset: 0; transform-style: preserve-3d; }
.ppc-orbit__ring > div {
	position: absolute; inset: 0; border-radius: 50%;
	border: 1px solid rgba(192, 132, 252, .35);
	box-shadow: 0 0 30px -10px rgba(192, 132, 252, .6), inset 0 0 30px -14px rgba(192, 132, 252, .6);
	animation: ppc-spin-z 14s linear infinite;
}
.ppc-orbit__ring > div i {
	position: absolute; top: -5px; left: calc(50% - 5px); width: 10px; height: 10px; border-radius: 50%;
	background: #F5D0FE; box-shadow: 0 0 12px 3px rgba(192, 132, 252, .9);
}
.ppc-orbit__ring > div i + i { top: auto; bottom: -4px; width: 7px; height: 7px; background: var(--ppc-pop-lt); }
.ppc-orbit__ring--1 { transform: rotateX(72deg); }
.ppc-orbit__ring--2 { inset: 9%; transform: rotateX(72deg) rotateY(-28deg); }
.ppc-orbit__ring--2 > div { animation-duration: 10s; animation-direction: reverse; border-style: dashed; border-color: rgba(192, 132, 252, .3); }
.ppc-orbit__ring--3 { inset: 2%; transform: rotateX(64deg) rotateY(38deg); }
.ppc-orbit__ring--3 > div { animation-duration: 20s; border-color: rgba(245, 208, 254, .22); }
@keyframes ppc-spin-z { to { transform: rotate(360deg); } }

.ppc-orbit__core {
	position: absolute; left: 50%; top: 50%; width: 34%; aspect-ratio: 1;
	display: grid; place-items: center; border-radius: 28%;
	transform: translate(-50%, -50%) translateZ(40px);
	background: linear-gradient(145deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .04));
	border: 1px solid rgba(255, 255, 255, .22);
	-webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
	box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .6), 0 0 60px -10px rgba(168, 85, 247, .7), inset 0 1px 0 rgba(255, 255, 255, .25);
	animation: ppc-core-bob 6s ease-in-out infinite;
}
.ppc-orbit__core::before {
	content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1.5px;
	background: conic-gradient(from var(--ppc-ang), transparent 0 60%, #F5D0FE 78%, #C084FC 88%, transparent);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor; mask-composite: exclude;
	animation: ppc-spin 4s linear infinite;
}
.ppc-orbit__core svg { width: 46%; height: 46%; color: #fff; filter: drop-shadow(0 0 12px rgba(192, 132, 252, .9)); }
@keyframes ppc-core-bob { 50% { translate: 0 -10px; } }

/* -------------------- Ambient background behind light sections -------------------- */
.ppc-ambient { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.ppc-ambient span {
	position: absolute; border-radius: 50%; filter: blur(90px); opacity: .22;
	translate: 0 calc(var(--scroll, 0) * -1px);
	animation: ppc-aurora 26s ease-in-out infinite alternate;
}
.ppc-ambient span:nth-child(1) { width: 38rem; height: 30rem; top: 10%; right: -14rem; background: #C084FC; --k: .08; }
.ppc-ambient span:nth-child(2) { width: 30rem; height: 26rem; top: 55%; left: -12rem; background: #A855F7; opacity: .14; animation-duration: 32s; }
.ppc-ambient span:nth-child(3) { width: 24rem; height: 20rem; top: 85%; right: 15%; background: #E9D5FF; opacity: .3; animation-duration: 22s; }
.ppc-ambient::after {
	content: ""; position: absolute; inset: 0;
	background-image: radial-gradient(rgba(123, 79, 160, .14) 1px, transparent 1px);
	background-size: 26px 26px;
	-webkit-mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent);
	        mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent);
}
body.ppc { background: #FCFAFE; }
.ppc .pp-main, .ppc .pp-section--bg-cream, .ppc .pp-section--bg-off, .ppc .ppc-section:not(.ppc-section--tint) { background: transparent; }
.ppc .ppc-section--tint { background: rgba(243, 235, 251, .55); }
.ppc .ppc-creds { background: rgba(255, 255, 255, .7); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }

/* -------------------- Prose (all inner pages) -------------------- */
.ppc .pp-prose > h2 { position: relative; padding-top: 1.4rem; }
.ppc .pp-prose > h2::before {
	content: ""; position: absolute; left: 0; top: 0; width: 3.5rem; height: 5px; border-radius: 5px;
	background: linear-gradient(90deg, var(--ppc-pop), var(--ppc-pop-lt), #F5D0FE);
	background-size: 200% 100%; animation: ppc-edge 4s linear infinite;
	transform-origin: left; transition: transform .9s var(--ppc-ease) .3s;
}
.ppc .pp-prose > h2.ppc-reveal:not(.is-in)::before { transform: scaleX(0); }
.ppc .pp-prose > h2 + p { margin-top: .75rem; }

.ppc .pp-prose ul:not([class]) { list-style: none; padding-left: 0; }
.ppc .pp-prose ul:not([class]) > li { position: relative; padding-left: 2.1rem; margin: .65rem 0; }
.ppc .pp-prose ul:not([class]) > li::before {
	content: ""; position: absolute; left: 0; top: .2em; width: 1.35rem; height: 1.35rem; border-radius: 50%;
	background: linear-gradient(135deg, var(--ppc-pop), var(--ppc-pop-lt));
	box-shadow: 0 4px 12px -4px rgba(147, 51, 234, .7);
}
.ppc .pp-prose ul:not([class]) > li::after {
	content: ""; position: absolute; left: .42rem; top: calc(.2em + .3rem); width: .5rem; height: .3rem;
	border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg);
}
.ppc .pp-prose a:not([class]) {
	color: var(--ppc-pop-dk); text-decoration: none;
	background: linear-gradient(90deg, var(--ppc-pop), var(--ppc-pop-lt)) 0 100% / 0 2px no-repeat;
	transition: background-size .35s var(--ppc-ease), color .2s;
	box-shadow: inset 0 -1px 0 rgba(147, 51, 234, .3);
}
.ppc .pp-prose a:not([class]):hover { background-size: 100% 2px; color: var(--ppc-pop); box-shadow: none; }

/* "Want a quote?" link blocks → glowing card */
.ppc .pp-prose-cta {
	position: relative; isolation: isolate; display: block;
	margin-top: 2.5rem; padding: 1.5rem 3.75rem 1.5rem 1.6rem; border-radius: 16px;
	background: linear-gradient(135deg, #1E1230, #2A1B3D 60%, #4C1D95) !important;
	color: rgba(255, 255, 255, .85) !important; text-decoration: none !important;
	box-shadow: 0 24px 50px -24px rgba(76, 29, 149, .8);
	transition: transform .35s var(--ppc-ease), box-shadow .35s;
}
.ppc .pp-prose-cta strong { display: block; margin-bottom: .2rem; color: #fff; font: 700 1.2rem/1.3 var(--pp-font-display); }
.ppc .pp-prose-cta::before {
	content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px; z-index: -1;
	background: conic-gradient(from var(--ppc-ang), #7C29CE, #F5D0FE, #A855F7, #C084FC, #7C29CE);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor; mask-composite: exclude;
	animation: ppc-spin 5s linear infinite;
}
.ppc .pp-prose-cta::after {
	content: "\2192"; position: absolute; right: 1.4rem; top: 50%; translate: 0 -50%;
	display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%;
	background: #fff; color: var(--ppc-deep); font-weight: 700; transition: translate .3s var(--ppc-ease);
}
.ppc .pp-prose-cta:hover { transform: translateY(-3px); box-shadow: 0 30px 60px -24px rgba(124, 41, 206, .9); }
.ppc .pp-prose-cta:hover::after { translate: 4px -50%; }

/* Belief / pillar cards and archive service cards */
.ppc .pp-pillar, .ppc .pp-service {
	background: rgba(255, 255, 255, .85); border: 1px solid var(--ppc-line);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	box-shadow: var(--ppc-shadow);
}
.ppc .pp-pillar__num {
	background: linear-gradient(135deg, var(--ppc-pop), var(--ppc-pop-lt));
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.ppc .pp-service__icon { transition: transform .5s var(--ppc-ease), background .3s, box-shadow .3s; }
.ppc .pp-service:hover .pp-service__icon {
	transform: rotate(-8deg) scale(1.1);
	background: linear-gradient(135deg, var(--ppc-pop), var(--ppc-pop-lt)); color: #fff;
	box-shadow: 0 10px 24px -8px rgba(147, 51, 234, .7);
}

/* Sidebar: animated border on the ads */
.ppc .pp-sidebar__card--cta { position: relative; isolation: isolate; }
.ppc .pp-sidebar__card--cta::after {
	content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px; pointer-events: none; z-index: 5;
	background: conic-gradient(from var(--ppc-ang), transparent 0 55%, #F5D0FE 75%, #C084FC 85%, transparent);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor; mask-composite: exclude;
	animation: ppc-spin 5s linear infinite;
}
.ppc .pp-sidebar__related a, .ppc .pp-sidebar__related li { transition: transform .3s var(--ppc-ease); }
.ppc .pp-sidebar__related li:hover { transform: translateX(4px); }

/* Contact page */
.ppc .pp-contact__map { border-radius: 18px; overflow: hidden; position: relative; box-shadow: var(--ppc-shadow); }
.ppc .pp-contact__map iframe { filter: grayscale(1) contrast(1.05) brightness(1.05); }
.ppc .pp-contact__map::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: rgba(147, 51, 234, .22); mix-blend-mode: multiply; }
.ppc .wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-checkbox):focus {
	outline: none; border-color: var(--ppc-pop) !important;
	box-shadow: 0 0 0 4px rgba(192, 132, 252, .25), 0 10px 30px -12px rgba(147, 51, 234, .5) !important;
}
.ppc .wpcf7-submit {
	background: linear-gradient(110deg, var(--ppc-pop-dk), var(--ppc-pop), #A855F7) !important;
	background-size: 200% 100% !important; transition: background-position .5s, transform .2s !important;
}
.ppc .wpcf7-submit:hover { background-position: 100% 0 !important; transform: translateY(-2px); }

/* CTA bands → hero-style dark */
.ppc .pp-cta-band, .ppc .pp-section--bg-aubergine {
	background:
		radial-gradient(40rem 22rem at 85% 0%, rgba(147, 51, 234, .5), transparent 60%),
		radial-gradient(30rem 20rem at 0% 100%, rgba(168, 85, 247, .3), transparent 60%),
		#160C24 !important;
}

/* -------------------- Global extras -------------------- */
/* Frosted header once you scroll */
.ppc-header.is-scrolled {
	background: rgba(255, 255, 255, .78);
	-webkit-backdrop-filter: blur(16px) saturate(170%); backdrop-filter: blur(16px) saturate(170%);
}

/* Back to top with progress ring */
.ppc-top {
	position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 90;
	display: grid; place-items: center; width: 3.1rem; height: 3.1rem; border-radius: 50%;
	border: 0; padding: 0; cursor: pointer; color: #fff;
	background: rgba(30, 18, 48, .85); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	box-shadow: 0 12px 30px -10px rgba(30, 18, 48, .6);
	opacity: 0; translate: 0 20px; pointer-events: none;
	transition: opacity .3s, translate .3s var(--ppc-ease);
}
.ppc-top.is-on { opacity: 1; translate: 0 0; pointer-events: auto; }
.ppc-top svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.ppc-top circle { fill: none; stroke-width: 3; }
.ppc-top circle:first-child { stroke: rgba(255, 255, 255, .12); }
.ppc-top circle + circle { stroke: var(--ppc-pop-lt); stroke-linecap: round; stroke-dasharray: 138.2; stroke-dashoffset: calc(138.2 * (1 - var(--p, 0))); }
.ppc-top span { position: relative; font-size: 1.1rem; line-height: 1; }
.ppc-top:hover { background: var(--ppc-pop); }

/* Generative artwork instead of stock images on cards */
.ppc-card__placeholder {
	position: relative; overflow: hidden;
	background:
		radial-gradient(circle at 20% 30%, rgba(245, 208, 254, .55), transparent 40%),
		radial-gradient(circle at 80% 70%, rgba(168, 85, 247, .7), transparent 45%),
		conic-gradient(from var(--ppc-ang) at 60% 40%, #2A1B3D, #7C29CE, #C084FC, #4C1D95, #2A1B3D);
	animation: ppc-spin 12s linear infinite;
}

/* Smooth page-to-page transitions (supporting browsers) */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: ppc-vt-out .3s ease both; }
::view-transition-new(root) { animation: ppc-vt-in .55s var(--ppc-ease) both; }
@keyframes ppc-vt-out { to { opacity: 0; transform: scale(.985); filter: blur(4px); } }
@keyframes ppc-vt-in { from { opacity: 0; transform: translateY(18px); } }

@media (prefers-reduced-motion: reduce) {
	.ppc .pp-breadcrumbs, .ppc .pp-page-header__icon, .ppc .pp-page-header__lead, .ppc .pp-hero__lead,
	.ppc .pp-page-header__ctas, .ppc .pp-hero__ctas, .ppc .pp-page-header__meta,
	.ppc .pp-page-header::after, .ppc-bfx *, .ppc-orbit, .ppc-orbit *, .ppc-orbit *::before,
	.ppc-ambient span, .ppc-word--grad, .ppc-word__squiggle, .ppc .pp-prose > h2::before,
	.ppc .pp-prose-cta::before, .ppc .pp-sidebar__card--cta::after, .ppc-card__placeholder { animation: none !important; }
	::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}

/* =========================================================================
   Seven banner styles — html[data-ppc-banner] is set by a tiny script in
   <head>, so the page paints in its style with no flash. commerce.js builds
   only the layers the chosen style needs, plus one of three 3D visuals.
   ========================================================================= */
.ppc-bfx canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.ppc-bfx .ppc-hero__aurora span { background: var(--b-a1); }
.ppc-bfx .ppc-hero__aurora span:nth-child(2) { background: var(--b-a2); }
.ppc-bfx .ppc-hero__aurora span:nth-child(3) { background: var(--b-a3); }
.ppc-bfx .ppc-fx__spot { position: absolute; inset: 0; background: radial-gradient(30rem circle at var(--sx, 70%) var(--sy, 30%), var(--b-spot, rgba(192, 132, 252, .16)), transparent 60%); }
.ppc-bfx .ppc-hero__floor { background-image: linear-gradient(var(--b-line) 1px, transparent 1px), linear-gradient(90deg, var(--b-line) 1px, transparent 1px); }

/* Morphing mesh glows (style 1) */
.ppc-bfx__mesh span {
	position: absolute; width: 34rem; height: 34rem; border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%;
	filter: blur(60px); mix-blend-mode: screen; opacity: .75;
	animation: ppc-morph 16s ease-in-out infinite alternate;
}
.ppc-bfx__mesh span:nth-child(1) { top: -40%; right: 5%; background: #7C29CE; }
.ppc-bfx__mesh span:nth-child(2) { bottom: -55%; left: 10%; background: #C026D3; opacity: .45; animation-duration: 20s; animation-delay: -5s; }
.ppc-bfx__mesh span:nth-child(3) { top: -20%; left: 45%; width: 24rem; height: 24rem; background: #A855F7; opacity: .5; animation-duration: 13s; animation-delay: -9s; }
@keyframes ppc-morph {
	0%   { border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%; transform: translate(0, 0) rotate(0deg) scale(1); }
	50%  { border-radius: 63% 37% 39% 61% / 57% 63% 37% 43%; transform: translate(-8rem, 3rem) rotate(120deg) scale(1.15); }
	100% { border-radius: 38% 62% 58% 42% / 36% 51% 49% 64%; transform: translate(5rem, -2rem) rotate(240deg) scale(.9); }
}

/* Light beams + twinkling glints (style 3) */
.ppc-bfx__beams i {
	position: absolute; top: -50%; width: 9rem; height: 200%;
	background: linear-gradient(90deg, transparent, var(--b-ray), transparent);
	transform: rotate(24deg); filter: blur(6px);
	animation: ppc-beam 9s ease-in-out infinite;
}
.ppc-bfx__beams i:nth-child(1) { left: 15%; }
.ppc-bfx__beams i:nth-child(2) { left: 48%; width: 5rem; animation-delay: -3s; animation-duration: 11s; }
.ppc-bfx__beams i:nth-child(3) { left: 78%; width: 12rem; animation-delay: -6s; animation-duration: 13s; }
@keyframes ppc-beam { 0%, 100% { opacity: .25; translate: -6rem 0; } 50% { opacity: 1; translate: 6rem 0; } }
.ppc-bfx__glints b {
	position: absolute; color: #F5D0FE; font-size: 1rem; line-height: 1;
	text-shadow: 0 0 12px rgba(240, 171, 252, .9);
	animation: ppc-glint 3.2s ease-in-out infinite;
}
.ppc-bfx__glints b::before { content: "\2726"; }
@keyframes ppc-glint { 0%, 100% { opacity: 0; transform: scale(.4) rotate(0deg); } 50% { opacity: 1; transform: scale(1) rotate(90deg); } }

/* Floating glass shapes (style 4) */
.ppc-bfx__glass i {
	position: absolute; border-radius: 22%;
	background: linear-gradient(135deg, rgba(255, 255, 255, .85), rgba(255, 255, 255, .2));
	border: 1px solid rgba(255, 255, 255, .9);
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
	box-shadow: 0 20px 40px -18px rgba(124, 41, 206, .45), inset 0 0 20px rgba(216, 180, 254, .35);
	animation: ppc-float3d 14s ease-in-out infinite;
}
.ppc-bfx__glass i:nth-child(1) { width: 6rem; height: 6rem; left: 46%; top: 12%; }
.ppc-bfx__glass i:nth-child(2) { width: 9rem; height: 3.2rem; border-radius: 99px; left: 58%; bottom: 14%; animation-delay: -4s; animation-duration: 17s; }
.ppc-bfx__glass i:nth-child(3) { width: 3.5rem; height: 3.5rem; left: 38%; bottom: 20%; animation-delay: -8s; animation-duration: 12s; }
.ppc-bfx__glass i:nth-child(4) { width: 4.5rem; height: 4.5rem; right: 4%; top: 10%; animation-delay: -2s; animation-duration: 19s; }
.ppc-bfx__glass i:nth-child(5) { width: 7rem; height: 2.4rem; border-radius: 99px; left: 4%; bottom: 8%; animation-delay: -10s; animation-duration: 15s; }
@keyframes ppc-float3d {
	0%, 100% { transform: translateY(0) rotate(-8deg) rotateX(10deg); }
	50%      { transform: translateY(-18px) rotate(10deg) rotateX(-10deg); }
}

/* Floor glow (style 5): soft light rolls up the grid floor and fades into the
   distance. No hard lines, and nothing bright behind the text. */
.ppc-bfx__scan {
	position: absolute; left: 0; right: 0; bottom: 0; height: 34%; overflow: hidden; pointer-events: none;
	-webkit-mask-image: linear-gradient(to top, #000 35%, transparent); mask-image: linear-gradient(to top, #000 35%, transparent);
}
.ppc-bfx__scan::before {
	content: ""; position: absolute; left: 10%; right: 10%; bottom: 0; height: 60%;
	background: radial-gradient(50% 50% at 50% 50%, rgba(232, 121, 249, .28), transparent 70%);
	animation: ppc-scan 8s ease-in-out infinite;
}
@keyframes ppc-scan {
	0%   { transform: translateY(60%) scaleX(1.2); opacity: 0; }
	30%  { opacity: 1; }
	100% { transform: translateY(-90%) scaleX(.5); opacity: 0; }
}
.ppc-bfx__horizon {
	position: absolute; left: 0; right: 0; bottom: 0; height: 40%; pointer-events: none;
	background: radial-gradient(70% 70% at 50% 100%, rgba(192, 38, 211, .22), transparent 70%);
}
@media (prefers-reduced-motion: reduce) { .ppc-bfx__scan::before { animation: none; opacity: .6; } }

/* Flowing waves (style 6) */
.ppc-bfx__waves { position: absolute; left: 0; bottom: 0; width: 200%; height: 75%; animation: ppc-waves 18s linear infinite; }
.ppc-bfx__waves path { fill: none; stroke: var(--b-line); stroke-width: 1.5; }
.ppc-bfx__waves path:nth-child(2) { stroke-opacity: .65; }
.ppc-bfx__waves path:nth-child(3) { stroke-opacity: .4; }
@keyframes ppc-waves { to { transform: translateX(-50%); } }

/* Style colours */
:root {
	--b-bg: #160C24; --b-a1: #7C29CE; --b-a2: #A855F7; --b-a3: #5B21B6;
	--b-line: rgba(192, 132, 252, .22); --b-ray: rgba(192, 132, 252, .12); --b-dot: 216, 180, 254;
}
html[data-ppc-banner="1"] { --b-bg: linear-gradient(135deg, #1A0B2E, #160C24 60%, #24103A); }
html[data-ppc-banner="2"] { --b-bg: radial-gradient(60rem 30rem at 70% 50%, #2E1065, #0E0820 65%); --b-a1: #6D28D9; --b-a2: #8B5CF6; --b-a3: #4338CA; --b-dot: 233, 213, 255; }
html[data-ppc-banner="3"] { --b-bg: linear-gradient(120deg, #1F0A26, #2E0B36 55%, #1A0B2E); --b-a1: #C026D3; --b-a2: #E879F9; --b-a3: #9333EA; --b-ray: rgba(240, 171, 252, .16); --b-spot: rgba(240, 171, 252, .2); }
html[data-ppc-banner="4"] {
	--b-bg: linear-gradient(135deg, #F6EEFF, #FFFFFF 55%, #F3E8FF); --b-text: #1E1230;
	--b-a1: #D8B4FE; --b-a2: #F5D0FE; --b-a3: #C4B5FD; --b-line: rgba(124, 41, 206, .14); --b-spot: rgba(192, 132, 252, .25);
}
html[data-ppc-banner="5"] { --b-bg: linear-gradient(180deg, #07040D, #140726 60%, #2A0B45); --b-a1: #7C29CE; --b-a2: #C026D3; --b-a3: #3B0764; --b-line: rgba(232, 121, 249, .45); }
html[data-ppc-banner="6"] { --b-bg: linear-gradient(160deg, #1A0F2B, #2A1B3D 60%, #3B1A5C); --b-a1: #7B4FA0; --b-a2: #A855F7; --b-a3: #6D28D9; --b-line: rgba(216, 180, 254, .55); }
html[data-ppc-banner="7"] { --b-bg: linear-gradient(180deg, #0F0820, #1E1033 70%, #2A1450); --b-a1: #7C29CE; --b-a2: #A855F7; --b-a3: #4C1D95; --b-dot: 216, 180, 254; }

html[data-ppc-banner="5"] .ppc-bfx .ppc-hero__floor { height: 60%; opacity: 1; animation-duration: 1.6s; }
html[data-ppc-banner="5"] .ppc-bfx .ppc-hero__aurora span { opacity: .3; }
html[data-ppc-banner="2"] .ppc-bfx .ppc-hero__aurora span,
html[data-ppc-banner="7"] .ppc-bfx .ppc-hero__aurora span { opacity: .3; }

/* Style 4 is light: dark text and purple accents */
html[data-ppc-banner="4"] .ppc-bfx .ppc-hero__aurora span { mix-blend-mode: multiply; opacity: .55; }
html[data-ppc-banner="4"] :is(.pp-page-header, .pp-hero--about, .pp-hero--location) :is(.pp-page-header__title, .pp-hero__title) { color: #1E1230 !important; }
html[data-ppc-banner="4"] :is(.pp-page-header, .pp-hero--about, .pp-hero--location) :is(.pp-page-header__lead, .pp-hero__lead) { color: #5F516B !important; }
html[data-ppc-banner="4"] :is(.pp-page-header, .pp-hero--about, .pp-hero--location) :is(.pp-breadcrumbs, .pp-breadcrumbs a, .pp-breadcrumbs li) { color: #6B5876 !important; }
html[data-ppc-banner="4"] :is(.pp-page-header, .pp-hero--about, .pp-hero--location) .pp-breadcrumbs [aria-current] { color: #1E1230 !important; }
html[data-ppc-banner="4"] :is(.pp-page-header, .pp-hero--about, .pp-hero--location) .pp-btn--ghost { color: #2A1B3D !important; border-color: rgba(42, 27, 61, .3) !important; }
html[data-ppc-banner="4"] .pp-page-header__icon { background: linear-gradient(135deg, #7C29CE, #C084FC) !important; color: #fff !important; border-color: transparent; }
html[data-ppc-banner="4"] .ppc-word--grad { background-image: linear-gradient(90deg, #7C29CE, #C026D3, #9333EA, #7C29CE); }
html[data-ppc-banner="4"] :is(.ppc-orbit__core, .ppc-cube__face, .ppc-stack__card) { background: linear-gradient(145deg, rgba(124, 41, 206, .92), rgba(168, 85, 247, .85)); border-color: rgba(255, 255, 255, .5); }
html[data-ppc-banner="4"] .ppc-orbit__ring > div { border-color: rgba(124, 41, 206, .35); box-shadow: none; }
html[data-ppc-banner="4"] .ppc-orbit__ring > div i { background: #7C29CE; box-shadow: 0 0 10px 2px rgba(147, 51, 234, .5); }

/* -------------------- Right-hand visuals: cube + card stack -------------------- */
.ppc-visual {
	position: absolute; z-index: 1; top: 50%; right: max(2rem, calc((100vw - var(--pp-container, 1240px)) / 2 + 1rem));
	width: clamp(13rem, 19vw, 19rem); aspect-ratio: 1;
	transform: translateY(-50%); perspective: 1000px; pointer-events: none;
	animation: ppc-orbit-in 1.4s var(--ppc-ease) backwards .2s;
}
@media (max-width: 1099px) { .ppc-visual { display: none; } }
.ppc-visual__tilt {
	position: absolute; inset: 0; transform-style: preserve-3d;
	transform: rotateX(calc(var(--my, 0) * -12deg)) rotateY(calc(var(--mx, 0) * 16deg));
	transition: transform .6s cubic-bezier(.2, .8, .2, 1);
}
.ppc-visual__glow { position: absolute; inset: 20%; border-radius: 50%; background: radial-gradient(circle, rgba(168, 85, 247, .5), transparent 65%); filter: blur(30px); animation: ppc-breathe 5s ease-in-out infinite; }

.ppc-cube { position: absolute; left: 50%; top: 50%; width: 46%; aspect-ratio: 1; transform-style: preserve-3d; translate: -50% -50%; animation: ppc-cube-spin 18s linear infinite; }
@keyframes ppc-cube-spin { from { transform: rotateX(-22deg) rotateY(0deg); } to { transform: rotateX(-22deg) rotateY(360deg); } }
.ppc-cube__face {
	position: absolute; inset: 0; display: grid; place-items: center; border-radius: 18%;
	background: linear-gradient(145deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .04));
	border: 1px solid rgba(245, 208, 254, .4);
	box-shadow: inset 0 0 30px rgba(192, 132, 252, .25), 0 0 40px -10px rgba(168, 85, 247, .6);
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.ppc-cube__face svg { width: 42%; height: 42%; color: #fff; filter: drop-shadow(0 0 10px rgba(192, 132, 252, .9)); }
.ppc-cube__face:nth-child(1) { transform: translateZ(calc(var(--s) / 2)); }
.ppc-cube__face:nth-child(2) { transform: rotateY(90deg) translateZ(calc(var(--s) / 2)); }
.ppc-cube__face:nth-child(3) { transform: rotateY(180deg) translateZ(calc(var(--s) / 2)); }
.ppc-cube__face:nth-child(4) { transform: rotateY(-90deg) translateZ(calc(var(--s) / 2)); }
.ppc-cube__face:nth-child(5) { transform: rotateX(90deg) translateZ(calc(var(--s) / 2)); }
.ppc-cube__face:nth-child(6) { transform: rotateX(-90deg) translateZ(calc(var(--s) / 2)); }

.ppc-stack { position: absolute; inset: 8%; transform-style: preserve-3d; }
.ppc-stack__card {
	position: absolute; left: 50%; top: 50%; width: 72%; height: 56%; translate: -50% -50%;
	padding: 1rem; border-radius: 16px; display: flex; flex-direction: column; gap: .55rem;
	background: linear-gradient(145deg, rgba(255, 255, 255, .17), rgba(255, 255, 255, .05));
	border: 1px solid rgba(245, 208, 254, .35);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	box-shadow: 0 30px 50px -20px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .25);
}
.ppc-stack__card:nth-child(1) { transform: translateZ(-60px) rotate(-14deg) translate(-14%, 6%); opacity: .55; animation: ppc-stack-a 8s ease-in-out infinite; }
.ppc-stack__card:nth-child(2) { transform: translateZ(-25px) rotate(9deg) translate(14%, -4%); opacity: .8; animation: ppc-stack-b 9s ease-in-out infinite; }
.ppc-stack__card:nth-child(3) { transform: translateZ(20px); animation: ppc-core-bob 6s ease-in-out infinite; }
@keyframes ppc-stack-a { 50% { transform: translateZ(-60px) rotate(-18deg) translate(-18%, 4%); } }
@keyframes ppc-stack-b { 50% { transform: translateZ(-25px) rotate(13deg) translate(18%, -6%); } }
.ppc-stack__icon { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 12px; background: linear-gradient(135deg, #7C29CE, #C084FC); box-shadow: 0 0 24px -4px rgba(192, 132, 252, .9); }
.ppc-stack__icon svg { width: 1.3rem; height: 1.3rem; color: #fff; }
.ppc-stack__card b { display: block; height: .5rem; width: 80%; border-radius: 4px; background: rgba(255, 255, 255, .55); }
.ppc-stack__card b + b { width: 55%; background: rgba(255, 255, 255, .3); }
.ppc-stack__card u { display: block; margin-top: auto; height: .4rem; border-radius: 4px; background: rgba(255, 255, 255, .12); overflow: hidden; }
.ppc-stack__card u::after { content: ""; display: block; height: 100%; width: 70%; border-radius: inherit; background: linear-gradient(90deg, #C084FC, #F5D0FE); animation: ppc-fill 3.5s ease-in-out infinite; transform-origin: left; }
@keyframes ppc-fill { 0% { transform: scaleX(.1); } 70%, 100% { transform: scaleX(1); } }

@media (prefers-reduced-motion: reduce) {
	.ppc-bfx *, .ppc-visual, .ppc-visual * { animation: none !important; }
}

/* =========================================================================
   Inner-page section layouts (inc/sections.php)
   ========================================================================= */
.ppc-sec { position: relative; padding-block: clamp(3rem, 2rem + 4vw, 5.5rem); }
.ppc-sec + .ppc-sec:not(.ppc-dark):not(.ppc-section--tint) { padding-top: clamp(1rem, 2vw, 2rem); }
.ppc-sec__title {
	margin: 0 0 1.25rem;
	font: 800 clamp(1.8rem, 1.3rem + 1.8vw, 2.8rem)/1.08 var(--pp-font-display); letter-spacing: -.025em;
	color: var(--ppc-ink); text-wrap: balance;
}
.ppc-sec__title--center { text-align: center; margin-inline: auto; max-width: 40rem; }
.ppc-sec__title em { font-style: normal; color: var(--ppc-pop); }
.ppc-sec__head { max-width: 46rem; margin-bottom: 2.25rem; }
.ppc-sec__head--center { margin-inline: auto; text-align: center; }
.ppc-sec__after { max-width: 46rem; margin-top: 2rem; }

.ppc-prose-x { font-size: 1.06rem; line-height: 1.75; color: #3D3248; }
.ppc-prose-x > :first-child { margin-top: 0; }
.ppc-prose-x p { margin: 0 0 1.1rem; }
.ppc-prose-x a { color: var(--ppc-pop-dk); text-decoration: none; background: linear-gradient(90deg, var(--ppc-pop), var(--ppc-pop-lt)) 0 100% / 0 2px no-repeat; box-shadow: inset 0 -1px 0 rgba(147, 51, 234, .3); transition: background-size .35s var(--ppc-ease); }
.ppc-prose-x a:hover { background-size: 100% 2px; box-shadow: none; }
.ppc-prose-x ul { list-style: none; padding: 0; margin: 0 0 1.25rem; }
.ppc-prose-x ul > li { position: relative; padding-left: 2.1rem; margin: .65rem 0; }
.ppc-prose-x ul > li::before { content: ""; position: absolute; left: 0; top: .2em; width: 1.35rem; height: 1.35rem; border-radius: 50%; background: linear-gradient(135deg, var(--ppc-pop), var(--ppc-pop-lt)); box-shadow: 0 4px 12px -4px rgba(147, 51, 234, .7); }
.ppc-prose-x ul > li::after { content: ""; position: absolute; left: .42rem; top: calc(.2em + .3rem); width: .5rem; height: .3rem; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); }
.ppc-prose-x h3 { margin: 1.75rem 0 .5rem; font: 700 1.25rem/1.3 var(--pp-font-display); color: var(--ppc-ink); }
.ppc-cols { columns: 2 22rem; column-gap: 3rem; }
.ppc-cols > * { break-inside: avoid; }

/* Intro variants */
.ppc-lede {
	position: relative; margin: 0 0 1.5rem;
	font: 600 clamp(1.35rem, 1.1rem + 1vw, 1.9rem)/1.4 var(--pp-font-display); letter-spacing: -.01em;
	color: var(--ppc-ink);
}
.ppc-lede::before {
	content: "\201C"; position: absolute; left: -.1em; top: -.55em; z-index: -1;
	font: 800 6rem/1 var(--pp-font-display); color: rgba(192, 132, 252, .3);
}
.ppc-lede--center { max-width: 52rem; margin: 0 auto 2.5rem; text-align: center; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.35rem); }
.ppc-lede--center::before { left: 50%; translate: -50% 0; }
.ppc-intro__grid { display: grid; gap: clamp(2rem, 4vw, 4rem); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 900px) {
	.ppc-intro__grid { grid-template-columns: 1.4fr 1fr; }
	.ppc-intro__grid--lede { grid-template-columns: 1fr 1fr; }
}
.ppc-glance {
	position: relative; isolation: isolate; padding: 1.75rem; border-radius: 20px; color: #fff;
	background: linear-gradient(150deg, #1E1230, #2A1B3D 55%, #5B21B6);
	box-shadow: 0 30px 60px -30px rgba(76, 29, 149, .8);
}
.ppc-glance::before {
	content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px; z-index: -1;
	background: conic-gradient(from var(--ppc-ang), transparent 0 55%, #F5D0FE 75%, #C084FC 85%, transparent);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
	animation: ppc-spin 5s linear infinite;
}
.ppc-glance__title { display: flex; align-items: center; gap: .5rem; margin: 0 0 1rem; font: 700 1.1rem/1.2 var(--pp-font-display); }
.ppc-glance__title .ppc-icon { color: var(--ppc-pop-lt); }
.ppc-glance ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .7rem; }
.ppc-glance li { display: flex; gap: .65rem; align-items: flex-start; font-size: .95rem; color: rgba(255, 255, 255, .85); }
.ppc-glance li .ppc-icon { width: 1.25rem; height: 1.25rem; padding: .2rem; flex: none; border-radius: 50%; background: rgba(192, 132, 252, .25); color: #F5D0FE; stroke-width: 3; }

/* Text layouts */
.ppc-text__grid { display: grid; gap: 1.5rem clamp(2rem, 5vw, 5rem); grid-template-columns: 1fr; }
@media (min-width: 900px) {
	.ppc-text__grid { grid-template-columns: 5fr 7fr; }
	.ppc-text__head { position: sticky; top: 7rem; align-self: start; }
	.ppc-text--split-rev .ppc-text__head { order: 2; }
	.ppc-text--split-rev .ppc-text__grid { grid-template-columns: 7fr 5fr; }
}
.ppc-text__head .ppc-sec__title { position: relative; padding-top: 1.4rem; }
.ppc-text__head .ppc-sec__title::before {
	content: ""; position: absolute; left: 0; top: 0; width: 3.5rem; height: 5px; border-radius: 5px;
	background: linear-gradient(90deg, var(--ppc-pop), var(--ppc-pop-lt), #F5D0FE); background-size: 200% 100%;
	animation: ppc-edge 4s linear infinite;
}
.ppc-text__narrow { max-width: 46rem; margin-inline: auto; }
.ppc-text--statement .ppc-sec__title { font-size: clamp(2rem, 1.4rem + 2.4vw, 3.3rem); }

/* Dark bands */
.ppc-dark { background: radial-gradient(40rem 22rem at 85% 0%, rgba(147, 51, 234, .45), transparent 60%), radial-gradient(30rem 20rem at 0% 100%, rgba(168, 85, 247, .25), transparent 60%), #160C24; color: #fff; }
.ppc-dark .ppc-sec__title { color: #fff; }
.ppc-dark .ppc-sec__title em { color: var(--ppc-pop-lt); }
.ppc-dark .ppc-prose-x { color: rgba(255, 255, 255, .8); }
.ppc-dark .ppc-prose-x a { color: #F5D0FE; }
.ppc-dark .ppc-prose-x h3, .ppc-dark .ppc-lede { color: #fff; }
.ppc-dark + .ppc-dark { border-top: 1px solid rgba(255, 255, 255, .08); }

/* Feature grid */
.ppc-feat-grid { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); }
@media (min-width: 900px) { .ppc-feat-grid--2 { grid-template-columns: repeat(2, 1fr); } .ppc-feat-grid--3 { grid-template-columns: repeat(3, 1fr); } }
.ppc-feat {
	position: relative; display: flex; flex-direction: column; gap: .35rem;
	padding: 1.5rem; border-radius: 16px;
	background: rgba(255, 255, 255, .8); border: 1px solid var(--ppc-line);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: var(--ppc-shadow);
}
.ppc-feat__icon { display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem; margin-bottom: .6rem; border-radius: 12px; background: linear-gradient(135deg, var(--ppc-pop), var(--ppc-pop-lt)); color: #fff; box-shadow: 0 10px 22px -10px rgba(147, 51, 234, .8); }
.ppc-feat__title { font: 700 1.1rem/1.3 var(--pp-font-display); color: var(--ppc-ink); }
.ppc-feat__meta { font-size: .8rem; font-weight: 600; color: var(--ppc-lilac); }
.ppc-feat__desc { font-size: .95rem; color: var(--ppc-muted); }

/* Card grid (h3 groups / pillars) */
.ppc-cardgrid { display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); }
@media (min-width: 1000px) {
	.ppc-cardgrid--bento { grid-template-columns: repeat(3, 1fr); }
	.ppc-cardgrid--bento .ppc-tile:first-child { grid-column: span 2; background: linear-gradient(150deg, #1E1230, #2A1B3D 55%, #5B21B6); color: #fff; border-color: transparent; }
	.ppc-cardgrid--bento .ppc-tile:first-child :is(.ppc-tile__title) { color: #fff; font-size: 1.6rem; }
	.ppc-cardgrid--bento .ppc-tile:first-child .ppc-tile__body { color: rgba(255, 255, 255, .8); font-size: 1.05rem; }
	.ppc-cardgrid--bento .ppc-tile:first-child .ppc-tile__num { color: rgba(255, 255, 255, .25); -webkit-text-fill-color: rgba(255,255,255,.25); }
}
.ppc-tile {
	position: relative; padding: 1.6rem; border-radius: 18px;
	background: rgba(255, 255, 255, .9); border: 1px solid var(--ppc-line); box-shadow: var(--ppc-shadow);
}
.ppc-tile__top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
.ppc-tile__icon { display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 12px; background: rgba(192, 132, 252, .16); color: var(--ppc-pop); transition: transform .5s var(--ppc-ease), background .3s, color .3s; }
.ppc-tile:hover .ppc-tile__icon, .ppc-more__card:hover .ppc-tile__icon { transform: rotate(-8deg) scale(1.1); background: linear-gradient(135deg, var(--ppc-pop), var(--ppc-pop-lt)); color: #fff; }
.ppc-tile__num { font: 800 2rem/1 var(--pp-font-display); background: linear-gradient(135deg, var(--ppc-pop), var(--ppc-pop-lt)); -webkit-background-clip: text; background-clip: text; color: transparent; opacity: .55; }
.ppc-tile__title { margin: 0 0 .4rem; font: 700 1.2rem/1.3 var(--pp-font-display); color: var(--ppc-ink); }
.ppc-tile__body { font-size: .96rem; color: var(--ppc-muted); }
.ppc-tile__body p { margin: 0 0 .6rem; }
.ppc-tile__body p:last-child { margin: 0; }

/* Timeline */
.ppc-timeline { position: relative; margin: 0 auto; padding: 0; list-style: none; max-width: 62rem; }
.ppc-timeline::before {
	content: ""; position: absolute; left: 1.5rem; top: .5rem; bottom: .5rem; width: 2px;
	background: linear-gradient(180deg, var(--ppc-pop), var(--ppc-pop-lt), rgba(192, 132, 252, .1));
}
.ppc-timeline__item { position: relative; padding-left: 4.5rem; margin-bottom: 1.4rem; }
.ppc-timeline__dot {
	position: absolute; left: 0; top: .6rem; display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%;
	background: linear-gradient(135deg, var(--ppc-pop), var(--ppc-pop-lt)); color: #fff;
	font: 800 1.1rem/1 var(--pp-font-display);
	box-shadow: 0 0 0 6px #FCFAFE, 0 0 0 7px rgba(192, 132, 252, .4), 0 10px 24px -8px rgba(147, 51, 234, .8);
}
.ppc-timeline__card { padding: 1.35rem 1.5rem; border-radius: 16px; background: rgba(255, 255, 255, .9); border: 1px solid var(--ppc-line); box-shadow: var(--ppc-shadow); }
.ppc-timeline__card h3 { margin: 0; font: 700 1.2rem/1.3 var(--pp-font-display); color: var(--ppc-ink); }
.ppc-timeline__meta { display: inline-block; margin-top: .35rem; padding: .2rem .6rem; border-radius: 99px; background: rgba(192, 132, 252, .15); color: var(--ppc-pop-dk); font-size: .78rem; font-weight: 600; }
.ppc-timeline__card p { margin: .6rem 0 0; color: var(--ppc-muted); }
@media (min-width: 900px) {
	.ppc-timeline::before { left: 50%; translate: -1px 0; }
	.ppc-timeline__item { width: 50%; padding: 0 3rem 0 0; }
	.ppc-timeline__item:nth-child(even) { margin-left: 50%; padding: 0 0 0 3rem; }
	.ppc-timeline__dot { left: auto; right: -1.5rem; }
	.ppc-timeline__item:nth-child(even) .ppc-timeline__dot { right: auto; left: -1.5rem; }
	.ppc-timeline__item:not(:first-child) { margin-top: -2.5rem; }
}

/* Spotlight ("How we scope it") */
.ppc-spotlight__inner { display: grid; gap: 2rem clamp(2rem, 5vw, 5rem); grid-template-columns: 1fr; align-items: center; }
@media (min-width: 900px) { .ppc-spotlight__inner { grid-template-columns: 1fr 1.2fr; } }
.ppc-spotlight .ppc-sec__title { font-size: clamp(2rem, 1.4rem + 2.4vw, 3.3rem); }
.ppc-spotlight .ppc-prose-x ul > li {
	padding: 1rem 1rem 1rem 3.2rem; margin: .6rem 0; border-radius: 14px;
	background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12);
}
.ppc-spotlight .ppc-prose-x ul > li::before { left: 1rem; top: 1.15rem; }
.ppc-spotlight .ppc-prose-x ul > li::after { left: 1.42rem; top: 1.45rem; }
.ppc-spotlight .ppc-prose-x strong { color: #fff; }

/* What's included */
.ppc-included__grid { display: grid; gap: .8rem; margin: 0; padding: 0; list-style: none; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); counter-reset: none; }
.ppc-included__grid li {
	display: flex; align-items: center; gap: 1rem; padding: 1rem 1.2rem; border-radius: 14px;
	background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); color: rgba(255, 255, 255, .9);
	transition: background .3s, border-color .3s, transform .3s var(--ppc-ease);
}
.ppc-included__grid li:hover { background: rgba(192, 132, 252, .14); border-color: rgba(192, 132, 252, .5); transform: translateY(-3px); }
.ppc-included__n { flex: none; font: 800 1.35rem/1 var(--pp-font-display); background: linear-gradient(135deg, #F5D0FE, #C084FC); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* Keep exploring */
.ppc-more__grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
.ppc-more__card, .ppc-more__ad {
	position: relative; display: flex; flex-direction: column; gap: .45rem; min-height: 15rem;
	padding: 1.5rem; border-radius: 18px; text-decoration: none;
}
.ppc-more__card { background: rgba(255, 255, 255, .9); border: 1px solid var(--ppc-line); box-shadow: var(--ppc-shadow); color: var(--ppc-muted); }
.ppc-more__card strong { margin-top: .6rem; font: 700 1.15rem/1.3 var(--pp-font-display); color: var(--ppc-ink); }
.ppc-more__card span:not(.ppc-tile__icon) { font-size: .92rem; }
.ppc-more__card em, .ppc-more__ad em { margin-top: auto; display: inline-flex; align-items: center; gap: .4rem; font-style: normal; font-weight: 600; color: var(--ppc-pop); }
.ppc-more__card em .ppc-icon, .ppc-more__ad em .ppc-icon { width: 1.1rem; height: 1.1rem; transition: translate .3s var(--ppc-ease); }
.ppc-more__card:hover em .ppc-icon, .ppc-more__ad:hover em .ppc-icon { translate: 4px 0; }
.ppc-more__ad {
	isolation: isolate; overflow: hidden; color: rgba(255, 255, 255, .8);
	background: linear-gradient(150deg, #1E1230, #2A1B3D 50%, #7C29CE);
	box-shadow: 0 30px 60px -30px rgba(76, 29, 149, .8);
}
.ppc-more__ad::before {
	content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px; z-index: -1;
	background: conic-gradient(from var(--ppc-ang), transparent 0 55%, #F5D0FE 75%, #C084FC 85%, transparent);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
	animation: ppc-spin 5s linear infinite;
}
.ppc-more__ad-icon { width: 2.75rem; height: 2.75rem; color: var(--ppc-pop-lt); }
.ppc-more__ad-icon svg { width: 100%; height: 100%; }
.ppc-more__ad strong { margin-top: .6rem; font: 800 1.3rem/1.2 var(--pp-font-display); color: #fff; }
.ppc-more__ad strong .pp-ad__price { color: var(--ppc-pop-lt); }
.ppc-more__ad span:not(.ppc-more__ad-icon) { font-size: .9rem; }
.ppc-more__ad em { color: #F5D0FE; }

@media (prefers-reduced-motion: reduce) {
	.ppc-glance::before, .ppc-more__ad::before, .ppc-text__head .ppc-sec__title::before { animation: none; }
}

/* Long opening paragraphs get a calmer size */
.ppc-lede--long, .ppc-lede--center.ppc-lede--long { font-size: clamp(1.15rem, 1rem + .55vw, 1.45rem); font-weight: 600; line-height: 1.5; }
.ppc-more__ad .pp-ad__price { font: inherit; color: var(--ppc-pop-lt); }

/* -------------------- Dark bands: drifting grid + light sweep (no dots) -------------------- */
.ppc-fx__grid {
	position: absolute; inset: -64px;
	background-image: linear-gradient(rgba(192, 132, 252, .09) 1px, transparent 1px), linear-gradient(90deg, rgba(192, 132, 252, .09) 1px, transparent 1px);
	background-size: 64px 64px;
	-webkit-mask-image: radial-gradient(ellipse at 70% 30%, #000 10%, transparent 70%);
	        mask-image: radial-gradient(ellipse at 70% 30%, #000 10%, transparent 70%);
	animation: ppc-grid-drift 12s linear infinite;
}
@keyframes ppc-grid-drift { to { transform: translate(64px, 64px); } }
.ppc-fx__sweep {
	position: absolute; inset: 0;
	background: linear-gradient(105deg, transparent 35%, rgba(192, 132, 252, .14) 48%, rgba(245, 208, 254, .2) 50%, rgba(192, 132, 252, .14) 52%, transparent 65%);
	background-size: 250% 100%;
	animation: ppc-sweep-bg 7s ease-in-out infinite;
}
@keyframes ppc-sweep-bg { 0%, 20% { background-position: 120% 0; } 80%, 100% { background-position: -120% 0; } }

/* -------------------- Big outlined numbers on text sections -------------------- */
.ppc-text__num {
	display: block; margin-bottom: -.25em;
	font: 800 clamp(4rem, 3rem + 4vw, 7.5rem)/1 var(--pp-font-display); letter-spacing: -.05em;
	color: transparent; -webkit-text-stroke: 1.5px rgba(124, 41, 206, .25);
}
.ppc-dark .ppc-text__num { -webkit-text-stroke-color: rgba(245, 208, 254, .25); }
.ppc-text--statement .ppc-text__num { text-align: center; }

@media (prefers-reduced-motion: reduce) {
	.ppc-fx__grid, .ppc-fx__sweep { animation: none !important; }
}

/* Midnight grid: keep the floor below the text */
html[data-ppc-banner="5"] .ppc-bfx .ppc-hero__floor { height: 42%; }

/* =========================================================================
   Ad cards — liquid colour, holographic foil, light sweep, icon life
   ========================================================================= */
@property --ppc-foil { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
.ppc-more__ad { min-height: 16rem; }
.ppc-more__ad > :not(.ppc-ad__fx) { position: relative; z-index: 1; }
.ppc-ad__fx { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; z-index: 0; pointer-events: none; }
.ppc-ad__blob {
	position: absolute; width: 14rem; height: 14rem; border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%;
	filter: blur(34px); opacity: .7; mix-blend-mode: screen;
	animation: ppc-morph 12s ease-in-out infinite alternate;
}
.ppc-ad__blob:nth-child(1) { top: -5rem; right: -5rem; background: #C026D3; }
.ppc-ad__blob:nth-child(2) { bottom: -6rem; left: -4rem; background: #7C29CE; animation-duration: 15s; animation-delay: -6s; }
.ppc-ad__foil {
	position: absolute; inset: -50%;
	background: conic-gradient(from var(--ppc-foil) at calc(50% + var(--gx-off, 0px)) calc(50% + var(--gy-off, 0px)),
		rgba(240, 171, 252, 0), rgba(240, 171, 252, .28), rgba(167, 139, 250, .3), rgba(245, 208, 254, .05),
		rgba(192, 132, 252, .3), rgba(232, 121, 249, .25), rgba(240, 171, 252, 0));
	mix-blend-mode: overlay; opacity: .55;
	animation: ppc-foil 10s linear infinite;
}
@keyframes ppc-foil { to { --ppc-foil: 360deg; } }
.ppc-more__ad:hover .ppc-ad__foil { opacity: 1; mix-blend-mode: color-dodge; }
.ppc-ad__fx::after { /* glare that follows the mouse */
	content: ""; position: absolute; inset: 0; opacity: 0; transition: opacity .3s;
	background: radial-gradient(14rem circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, .28), transparent 55%);
}
.ppc-more__ad:hover .ppc-ad__fx::after { opacity: 1; }
.ppc-ad__shine {
	position: absolute; inset: 0;
	background: linear-gradient(110deg, transparent 35%, rgba(255, 255, 255, .35) 50%, transparent 65%);
	transform: translateX(-120%); animation: ppc-ad-shine 5s ease-in-out infinite 1.5s;
}
@keyframes ppc-ad-shine { 0%, 70% { transform: translateX(-120%); } 100% { transform: translateX(120%); } }
.ppc-more__ad .ppc-glow__fx { display: none; }
.ppc-more__ad strong .pp-ad__price {
	background: linear-gradient(90deg, #F5D0FE, #C084FC, #F0ABFC, #F5D0FE); background-size: 300% 100%;
	-webkit-background-clip: text; background-clip: text; color: transparent;
	animation: ppc-shimmer 4s linear infinite;
}

/* Icon life */
.ppc-more__ad-icon { position: relative; display: inline-block; filter: drop-shadow(0 0 10px rgba(192, 132, 252, .7)); }
.ppc-more__ad:hover .ppc-more__ad-icon { animation: ppc-wiggle .6s var(--ppc-ease); }
@keyframes ppc-wiggle { 30% { transform: rotate(-10deg) scale(1.1); } 60% { transform: rotate(6deg) scale(1.05); } }
.ppc-ad__steam { position: absolute; left: 22%; bottom: 78%; width: 60%; height: 1.6rem; }
.ppc-ad__steam i {
	position: absolute; bottom: 0; width: 3px; height: 1.2rem; border-radius: 3px;
	background: linear-gradient(to top, rgba(245, 208, 254, .9), transparent);
	animation: ppc-steam 2.4s ease-in-out infinite; opacity: 0;
}
.ppc-ad__steam i:nth-child(1) { left: 15%; }
.ppc-ad__steam i:nth-child(2) { left: 45%; animation-delay: .8s; }
.ppc-ad__steam i:nth-child(3) { left: 75%; animation-delay: 1.6s; }
@keyframes ppc-steam { 0% { opacity: 0; transform: translateY(4px) scaleY(.6) skewX(0); } 40% { opacity: 1; } 100% { opacity: 0; transform: translateY(-14px) scaleY(1.2) skewX(14deg); } }
.ppc-ad__bars { position: absolute; left: calc(100% + .6rem); bottom: .2rem; display: flex; align-items: flex-end; gap: 3px; height: 1.6rem; }
.ppc-ad__bars i { width: 4px; height: 100%; border-radius: 2px; background: linear-gradient(to top, #C084FC, #F5D0FE); transform-origin: bottom; animation: ppc-bars 1.1s ease-in-out infinite alternate; }
.ppc-ad__bars i:nth-child(2) { animation-delay: -.3s; }
.ppc-ad__bars i:nth-child(3) { animation-delay: -.7s; }
.ppc-ad__bars i:nth-child(4) { animation-delay: -.15s; }
.ppc-ad__bars i:nth-child(5) { animation-delay: -.5s; }
@keyframes ppc-bars { from { transform: scaleY(.2); } to { transform: scaleY(1); } }
.ppc-ad__sparks i { position: absolute; color: #F5D0FE; font-style: normal; font-size: .8rem; animation: ppc-glint 2.4s ease-in-out infinite; }
.ppc-ad__sparks i::before { content: "\2726"; }
.ppc-ad__sparks i:nth-child(1) { top: -.6rem; right: -.8rem; }
.ppc-ad__sparks i:nth-child(2) { bottom: -.2rem; right: -1.3rem; animation-delay: .8s; font-size: .6rem; }
.ppc-ad__sparks i:nth-child(3) { top: .2rem; left: -1rem; animation-delay: 1.6s; font-size: .55rem; }

@media (prefers-reduced-motion: reduce) {
	.ppc-ad__fx *, .ppc-more__ad-icon, .ppc-more__ad-icon *, .ppc-more__ad strong .pp-ad__price { animation: none !important; }
}
.ppc-more__ad::before { z-index: 2; pointer-events: none; }
/* Keep ad / explore card text readable on hover (the parent's a:hover colour would win) */
.ppc-more__ad, .ppc-more__ad:hover { color: rgba(255, 255, 255, .85); }
.ppc-more__card, .ppc-more__card:hover { color: var(--ppc-muted); }
.ppc-more__ad strong .pp-ad__price { font-size: 1em !important; font-weight: 800; display: inline; }
.ppc-ad__steam i { width: 4px; background: linear-gradient(to top, rgba(255, 255, 255, .95), rgba(245, 208, 254, 0)); }
.ppc-ad__sparks i { font-size: 1rem; text-shadow: 0 0 10px rgba(240, 171, 252, .9); }

/* -------------------- Mega menu: plain-English links with a one-liner -------------------- */
.ppc-mega__link { display: grid; gap: .15rem; padding: .55rem .7rem; margin-inline: -.7rem; border-radius: 10px; transition: background .2s, transform .2s var(--ppc-ease); }
.ppc-mega__link:hover, .ppc-mega__link.is-current { background: var(--ppc-tint); transform: none; }
.ppc-mega__label { font-weight: 600; color: var(--ppc-ink); }
.ppc-mega__link:hover .ppc-mega__label, .ppc-mega__link.is-current .ppc-mega__label { color: var(--ppc-pop); }
.ppc-mega__desc { font-size: .82rem; line-height: 1.35; color: var(--ppc-muted); }
.ppc-mega__cols { grid-template-columns: repeat(auto-fit, minmax(13.5rem, 1fr)); gap: 1.5rem 2.25rem; }
.ppc-mega__col ul { gap: .2rem; }
.ppc-mega__help {
	display: block; margin-top: 1.5rem; padding: .9rem 1rem; border-radius: 12px;
	background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14);
	font-size: .85rem; line-height: 1.45; color: rgba(255, 255, 255, .78);
	transition: background .2s, border-color .2s;
}
.ppc-mega__help strong { display: block; color: #fff; margin-bottom: .15rem; }
.ppc-mega__help:hover { background: rgba(192, 132, 252, .16); border-color: rgba(192, 132, 252, .5); color: #fff; }
.ppc-nav .pp-nav__link { padding: .65rem .75rem; font-size: .97rem; }
@media (max-width: 1279px) { .ppc-nav .pp-nav__link { padding: .6rem .55rem; font-size: .93rem; } .ppc-header__inner { gap: 1.25rem; } }

/* -------------------- Mid-page CTA strip -------------------- */
.ppc-strip { padding-block: clamp(1rem, 2vw, 1.75rem); }
.ppc-strip__inner {
	position: relative; isolation: isolate; overflow: hidden;
	display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem 2rem;
	padding: 1.5rem clamp(1.25rem, 3vw, 2.25rem); border-radius: 20px;
	background: linear-gradient(120deg, #1E1230, #2A1B3D 45%, #6D28D9);
	color: #fff; box-shadow: 0 30px 60px -30px rgba(76, 29, 149, .7);
}
.ppc-strip__inner::before {
	content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px; z-index: -1;
	background: conic-gradient(from var(--ppc-ang), transparent 0 55%, #F5D0FE 75%, #C084FC 85%, transparent);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
	animation: ppc-spin 6s linear infinite;
}
.ppc-strip__inner::after {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: linear-gradient(110deg, transparent 35%, rgba(255, 255, 255, .12) 50%, transparent 65%);
	transform: translateX(-120%); animation: ppc-ad-shine 7s ease-in-out infinite 2s;
}
.ppc-strip__icon { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: 14px; background: rgba(255, 255, 255, .1); color: var(--ppc-pop-lt); flex: none; animation: ppc-core-bob 4s ease-in-out infinite; }
.ppc-strip__copy { flex: 1 1 18rem; }
.ppc-strip__title { margin: 0; font: 800 1.35rem/1.2 var(--pp-font-display); }
.ppc-strip__text { margin: .25rem 0 0; color: rgba(255, 255, 255, .75); font-size: .97rem; }
.ppc-strip__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .9rem 1.25rem; }
.ppc-strip .ppc-btn--primary { background: #fff; color: var(--ppc-deep); }
.ppc-strip .ppc-btn--primary:hover { background: var(--ppc-pop-lt); color: var(--ppc-deep); }
.ppc-strip__call { display: inline-flex; align-items: center; gap: .45rem; color: #fff; font-weight: 600; }
.ppc-strip__call:hover { color: var(--ppc-pop-lt); }

/* -------------------- Sticky contact bar on phones -------------------- */
.ppc-mbar { display: none; }
@media (max-width: 767px) {
	.ppc-mbar {
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 95;
		display: grid; grid-template-columns: 1fr 1.4fr; gap: .5rem;
		padding: .6rem 12px calc(.6rem + env(safe-area-inset-bottom));
		background: rgba(22, 12, 36, .92); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
		border-top: 1px solid rgba(255, 255, 255, .1);
	}
	.ppc-mbar a { display: flex; align-items: center; justify-content: center; gap: .45rem; padding: .75rem; border-radius: 12px; font-weight: 600; font-size: .95rem; }
	.ppc-mbar .ppc-icon { width: 1.05rem; height: 1.05rem; }
	.ppc-mbar__call { color: #fff; border: 1px solid rgba(255, 255, 255, .25); }
	.ppc-mbar__chat { background: linear-gradient(110deg, var(--ppc-pop-dk), var(--ppc-pop)); color: #fff; }
	.ppc-mbar a:hover { color: #fff; }
	body.ppc { padding-bottom: calc(4.5rem + env(safe-area-inset-bottom)); }
	.ppc-top { bottom: calc(5.25rem + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) { .ppc-strip__inner::before, .ppc-strip__inner::after, .ppc-strip__icon { animation: none; } }
.ppc-platform__mark .ppc-icon { width: 1.6rem; height: 1.6rem; }

/* -------------------- Compact mega menu -------------------- */
.ppc-mega__inner { display: block; padding-block: 1.4rem 1rem; }
.ppc-mega__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: .5rem 2rem; }
.ppc-mega__heading { margin: 0 0 .35rem; padding-bottom: .4rem; font-size: .72rem; }
.ppc-mega__col ul { gap: 0; }
.ppc-mega__link { padding: .4rem .6rem; margin-inline: -.6rem; gap: .05rem; border-radius: 8px; }
.ppc-mega__label { font-size: .93rem; }
.ppc-mega__desc { font-size: .78rem; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ppc-mega__foot {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1.5rem;
	margin-top: 1rem; padding-top: .85rem; border-top: 1px solid var(--ppc-line);
}
.ppc-mega__all { font-size: .9rem; font-weight: 600; color: var(--ppc-pop); }
.ppc-mega__all:hover { color: var(--ppc-pop-dk); }
.ppc-mega__help {
	display: inline-flex; align-items: center; gap: .6rem; margin: 0; padding: .45rem .9rem;
	border-radius: 99px; background: var(--ppc-tint); border: 1px solid var(--ppc-line);
	font-size: .85rem; color: var(--ppc-muted);
}
.ppc-mega__help strong { display: inline; margin: 0 .25rem 0 0; color: var(--ppc-ink); }
.ppc-mega__help .ppc-icon { width: 1rem; height: 1rem; color: var(--ppc-pop); }
.ppc-mega__help:hover { background: #fff; border-color: var(--ppc-pop-lt); color: var(--ppc-ink); }
.ppc-mega__cols { grid-template-columns: repeat(auto-fill, minmax(14rem, 18rem)); gap: .5rem 2.5rem; }
.ppc-mega__cols { grid-template-columns: repeat(auto-fill, minmax(13rem, 16.5rem)); gap: .5rem 2rem; }

/* =========================================================================
   Cookie consent, click-to-load embeds, legal pages
   ========================================================================= */
.ppc-consent {
	position: fixed; left: 1rem; bottom: 1rem; z-index: 200; width: min(28rem, calc(100vw - 2rem));
	border-radius: 20px; color: #fff; isolation: isolate;
	background: rgba(22, 12, 36, .94); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
	box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .1);
	opacity: 0; translate: 0 20px; transition: opacity .3s, translate .35s var(--ppc-ease);
}
.ppc-consent.is-open { opacity: 1; translate: 0 0; }
.ppc-consent::before {
	content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px; z-index: -1; pointer-events: none;
	background: conic-gradient(from var(--ppc-ang), transparent 0 60%, #F5D0FE 78%, #C084FC 88%, transparent);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
	animation: ppc-spin 6s linear infinite;
}
.ppc-consent__main { padding: 1.35rem 1.4rem 1.25rem; }
.ppc-consent__title { display: flex; align-items: center; gap: .55rem; margin: 0 0 .5rem; font: 800 1.1rem/1.25 var(--pp-font-display); }
.ppc-consent__title .ppc-icon { color: var(--ppc-pop-lt); }
.ppc-consent__text { margin: 0 0 1rem; font-size: .9rem; line-height: 1.55; color: rgba(255, 255, 255, .8); }
.ppc-consent__text a { color: #F5D0FE; text-decoration: underline; text-underline-offset: 2px; }
.ppc-consent__actions { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.ppc-consent__btn {
	padding: .75rem 1rem; border-radius: 10px; border: 0; cursor: pointer;
	font: 600 .92rem/1 var(--pp-font-body); transition: background .2s, color .2s, border-color .2s;
}
/* Accept and Reject look identical: no nudging. */
.ppc-consent__btn--solid { background: #fff; color: var(--ppc-deep); }
.ppc-consent__btn--solid:hover { background: var(--ppc-pop-lt); }
.ppc-consent__btn--ghost { grid-column: 1 / -1; background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .25); }
.ppc-consent__btn--ghost:hover { border-color: #fff; }
.ppc-consent__btn:focus-visible { outline: 2px solid var(--ppc-pop-lt); outline-offset: 2px; }
.ppc-consent__prefs { display: grid; gap: .5rem; margin: 0 0 1rem; }
.ppc-consent__opt {
	position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	padding: .75rem .85rem; border-radius: 12px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1);
	font-size: .8rem; line-height: 1.4; color: rgba(255, 255, 255, .7); cursor: pointer;
}
.ppc-consent__opt strong { display: block; font-size: .9rem; color: #fff; }
.ppc-consent__opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ppc-consent__opt i { flex: none; position: relative; width: 2.6rem; height: 1.5rem; border-radius: 99px; background: rgba(255, 255, 255, .2); transition: background .2s; }
.ppc-consent__opt i::after { content: ""; position: absolute; left: .2rem; top: .2rem; width: 1.1rem; height: 1.1rem; border-radius: 50%; background: #fff; transition: translate .2s var(--ppc-ease); }
.ppc-consent__opt input:checked + i { background: var(--ppc-pop); }
.ppc-consent__opt input:checked + i::after { translate: 1.1rem 0; }
.ppc-consent__opt input:focus-visible + i { outline: 2px solid var(--ppc-pop-lt); outline-offset: 2px; }
.ppc-consent__opt.is-locked { cursor: default; }
.ppc-consent__opt.is-locked i { opacity: .6; }
@media (max-width: 767px) {
	.ppc-consent { left: .5rem; right: .5rem; width: auto; bottom: calc(5rem + env(safe-area-inset-bottom)); max-height: calc(100vh - 7rem); overflow-y: auto; }
}

.ppc-embed { position: relative; min-height: 16rem; height: 100%; border-radius: inherit; background:
	repeating-linear-gradient(0deg, rgba(124, 41, 206, .06) 0 1px, transparent 1px 28px),
	repeating-linear-gradient(90deg, rgba(124, 41, 206, .06) 0 1px, transparent 1px 28px), var(--ppc-tint); }
.ppc-embed iframe { display: block; width: 100%; height: 100%; min-height: 18rem; border: 0; }
.ppc-embed__msg { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: .75rem; padding: 1.5rem; text-align: center; }
.ppc-embed__msg p { margin: 0; max-width: 22rem; font-size: .9rem; color: var(--ppc-muted); }
.ppc-embed__icon { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; background: linear-gradient(135deg, var(--ppc-pop), var(--ppc-pop-lt)); color: #fff; animation: ppc-core-bob 4s ease-in-out infinite; }
.ppc .pp-contact__map:has(.ppc-embed:not(.is-loaded))::after { display: none; }

.ppc-form-note { display: flex; align-items: flex-start; gap: .5rem; margin: 1rem 0 0; font-size: .85rem; color: var(--ppc-muted); }
.ppc-form-note .ppc-icon { width: 1rem; height: 1rem; margin-top: .15rem; color: var(--ppc-pop); flex: none; }
.ppc-form-note a { color: var(--ppc-pop-dk); text-decoration: underline; text-underline-offset: 2px; }

.ppc-legal__updated { margin: .75rem 0 0; font-size: .85rem; opacity: .7; }
.ppc-legal__grid { display: grid; gap: 2rem clamp(2rem, 5vw, 4rem); grid-template-columns: 1fr; }
@media (min-width: 960px) { .ppc-legal__grid { grid-template-columns: 15rem minmax(0, 46rem); } }
.ppc-legal__toc { align-self: start; padding: 1.25rem; border-radius: 16px; background: rgba(255, 255, 255, .85); border: 1px solid var(--ppc-line); box-shadow: var(--ppc-shadow); }
@media (min-width: 960px) { .ppc-legal__toc { position: sticky; top: 7rem; } }
.ppc-legal__toc p { margin: 0 0 .6rem; font: 700 .78rem/1 var(--pp-font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--ppc-lilac); }
.ppc-legal__toc ol { margin: 0; padding-left: 1.1rem; display: grid; gap: .35rem; font-size: .88rem; }
.ppc-legal__toc a { color: var(--ppc-ink); }
.ppc-legal__toc a:hover { color: var(--ppc-pop); }
.ppc-legal__body h2 { scroll-margin-top: 7rem; margin: 2.5rem 0 .75rem; font: 800 1.5rem/1.2 var(--pp-font-display); color: var(--ppc-ink); }
.ppc-legal__body h2:first-child { margin-top: 0; }
.ppc-legal__body .ppc-legal__short {
	padding: 1.25rem 1.4rem; border-radius: 16px; margin-bottom: 2rem;
	background: linear-gradient(135deg, rgba(147, 51, 234, .08), rgba(192, 132, 252, .12)); border: 1px solid rgba(192, 132, 252, .35);
}
.ppc-legal__body table { width: 100%; border-collapse: collapse; margin: 1rem 0 1.5rem; font-size: .9rem; }
.ppc-legal__body th, .ppc-legal__body td { padding: .65rem .75rem; border-bottom: 1px solid var(--ppc-line); text-align: left; vertical-align: top; }
.ppc-legal__body th { font-weight: 700; color: var(--ppc-ink); background: var(--ppc-tint); }
@media (max-width: 640px) { .ppc-legal__body table { display: block; overflow-x: auto; } }
@media (prefers-reduced-motion: reduce) { .ppc-consent, .ppc-consent::before, .ppc-embed__icon { transition: none; animation: none; } }
.ppc-consent__prefs[hidden], .ppc-consent__btn[hidden] { display: none; }

/* =========================================================================
   News: generated artwork, cards, filters, articles
   ========================================================================= */
.ppc-art {
	--c1: #2A1B3D; --c2: #7C29CE; --c3: #C084FC;
	position: relative; display: block; width: 100%; height: 100%; overflow: hidden; isolation: isolate;
	background:
		radial-gradient(circle at var(--x) var(--y), color-mix(in srgb, var(--c3) 70%, transparent), transparent 45%),
		conic-gradient(from var(--a) at 70% 30%, var(--c1), var(--c2), var(--c3), var(--c1));
}
.ppc-art--security  { --c1: #1A0B2E; --c2: #6D28D9; --c3: #F0ABFC; }
.ppc-art--php       { --c1: #1E1B4B; --c2: #4F46E5; --c3: #A5B4FC; }
.ppc-art--magento   { --c1: #2A1B3D; --c2: #C026D3; --c3: #F5D0FE; }
.ppc-art--ecommerce { --c1: #3B0764; --c2: #9333EA; --c3: #E9D5FF; }
.ppc-art--laravel   { --c1: #2E1065; --c2: #A855F7; --c3: #FBCFE8; }
.ppc-art--ai        { --c1: #160C24; --c2: #7C3AED; --c3: #C4B5FD; }
.ppc-art--wordpress { --c1: #1E1230; --c2: #7B4FA0; --c3: #DDD6FE; }
.ppc-art--websites  { --c1: #24103A; --c2: #8B5CF6; --c3: #F5D0FE; }
.ppc-art__grid {
	position: absolute; inset: 0; opacity: .35;
	background-image: linear-gradient(rgba(255, 255, 255, .14) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .14) 1px, transparent 1px);
	background-size: 28px 28px;
	-webkit-mask-image: radial-gradient(ellipse at 30% 70%, #000, transparent 75%); mask-image: radial-gradient(ellipse at 30% 70%, #000, transparent 75%);
}
.ppc-art__orb { position: absolute; width: 55%; aspect-ratio: 1; right: -10%; bottom: -25%; border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%; background: var(--c3); filter: blur(28px); opacity: .45; animation: ppc-morph 14s ease-in-out infinite alternate; }
.ppc-art__icon {
	position: absolute; left: 1.25rem; top: 1.25rem; display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: 14px;
	background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .3); color: #fff;
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	transition: transform .5s var(--ppc-ease);
}
.ppc-art__icon .ppc-icon { width: 1.5rem; height: 1.5rem; }
.ppc-art__word {
	position: absolute; right: .9rem; bottom: .3rem; white-space: nowrap;
	font: 800 clamp(2.4rem, 1.5rem + 3vw, 3.6rem)/1 var(--pp-font-display); letter-spacing: -.04em;
	color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .45);
}
.ppc-art--wide .ppc-art__word { font-size: clamp(3rem, 2rem + 5vw, 6rem); }
.ppc-art--wide .ppc-art__icon { width: 4.25rem; height: 4.25rem; left: 1.75rem; top: 1.75rem; }

.ppc-chip {
	display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .75rem; border-radius: 99px;
	background: rgba(192, 132, 252, .14); color: var(--ppc-pop-dk); font: 600 .78rem/1.2 var(--pp-font-body);
	border: 1px solid transparent; transition: background .2s, color .2s, border-color .2s;
}
.ppc-chip small { font-size: .7rem; opacity: .7; }
.ppc-chip:hover { background: rgba(192, 132, 252, .26); color: var(--ppc-pop-dk); }
.ppc-chip.is-active { background: var(--ppc-pop); color: #fff; }
.ppc-filters { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 2rem; }
.ppc-filters .ppc-chip { padding: .5rem 1rem; font-size: .88rem; background: #fff; border-color: var(--ppc-line); color: var(--ppc-ink); }
.ppc-filters .ppc-chip.is-active { background: var(--ppc-pop); border-color: var(--ppc-pop); color: #fff; }

.ppc-post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .9rem; margin: 0 0 .6rem; font-size: .82rem; color: var(--ppc-muted); }
.ppc-post {
	position: relative; display: flex; flex-direction: column; overflow: hidden; border-radius: 18px;
	background: rgba(255, 255, 255, .92); border: 1px solid var(--ppc-line); box-shadow: var(--ppc-shadow);
	transition: transform .35s var(--ppc-ease), box-shadow .35s;
}
.ppc-post:hover { transform: translateY(-4px); box-shadow: 0 24px 44px -24px rgba(76, 29, 149, .5); }
.ppc-post:hover .ppc-art__icon { transform: rotate(-8deg) scale(1.08); }
.ppc-post__media { display: block; aspect-ratio: 16 / 9; }
.ppc-post__body { display: flex; flex-direction: column; flex: 1; padding: 1.4rem 1.5rem 1.5rem; }
.ppc-post__title { margin: 0 0 .5rem; font: 700 1.2rem/1.3 var(--pp-font-display); letter-spacing: -.03em; } /* same whether it's an h2 or h3 */
.ppc-post__title a { color: var(--ppc-ink); }
.ppc-post__title a:hover { color: var(--ppc-pop); }
.ppc-post__excerpt { margin: 0 0 1rem; font-size: .94rem; color: var(--ppc-muted); }
.ppc-post__body .ppc-link { margin-top: auto; }
.ppc-post--featured { margin-bottom: 1.5rem; }
@media (min-width: 900px) {
	.ppc-post--featured { display: grid; grid-template-columns: 1.15fr 1fr; }
	.ppc-post--featured .ppc-post__media { aspect-ratio: auto; min-height: 20rem; }
	.ppc-post--featured .ppc-post__body { justify-content: center; padding: 2.5rem; }
	.ppc-post--featured .ppc-post__title { font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.2rem); }
}
.ppc-post-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.ppc-pagination { margin-top: 2.5rem; }
.ppc-pagination .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; }
.ppc-pagination .page-numbers { display: inline-grid; place-items: center; min-width: 2.6rem; height: 2.6rem; padding: 0 .9rem; border-radius: 10px; background: #fff; border: 1px solid var(--ppc-line); color: var(--ppc-ink); font-weight: 600; }
.ppc-pagination .page-numbers.current, .ppc-pagination .page-numbers:hover { background: var(--ppc-pop); border-color: var(--ppc-pop); color: #fff; }

/* Article */
.ppc-article__meta { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; margin-top: .75rem; }
.ppc-article__meta .ppc-post-meta { margin: 0; color: inherit; opacity: .85; }
.ppc-article__meta .ppc-chip { background: rgba(22, 12, 36, .6); color: #fff; } /* dark enough for WCAG AA on every banner style */
html[data-ppc-banner="4"] .ppc-article__meta .ppc-chip { background: var(--ppc-pop); }
.ppc-article__by { font-size: .85rem; opacity: .8; }
.ppc-article__side { display: grid; gap: 1rem; align-content: start; }
@media (min-width: 960px) { .ppc-article__side { position: sticky; top: 7rem; align-self: start; } .ppc-article__side .ppc-legal__toc { position: static; } }
.ppc-share { padding: 1.1rem 1.25rem; border-radius: 16px; background: rgba(255, 255, 255, .85); border: 1px solid var(--ppc-line); display: flex; flex-wrap: wrap; gap: .4rem; }
.ppc-share p { flex-basis: 100%; margin: 0 0 .3rem; font: 700 .78rem/1 var(--pp-font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--ppc-lilac); }
.ppc-share a, .ppc-share button { padding: .35rem .7rem; border-radius: 99px; border: 1px solid var(--ppc-line); background: #fff; color: var(--ppc-ink); font: 600 .8rem/1.2 var(--pp-font-body); cursor: pointer; }
.ppc-share a:hover, .ppc-share button:hover { border-color: var(--ppc-pop-lt); color: var(--ppc-pop); }
.ppc-article__body { font-size: 1.08rem; }
.ppc-article__body blockquote {
	position: relative; margin: 2rem 0; padding: 1.4rem 1.6rem 1.4rem 3.4rem; border: 0; border-radius: 16px;
	background: linear-gradient(135deg, rgba(147, 51, 234, .08), rgba(192, 132, 252, .14));
	font: 600 1.25rem/1.45 var(--pp-font-display); color: var(--ppc-ink);
}
.ppc-article__body blockquote::before { content: "\201C"; position: absolute; left: 1rem; top: .2rem; font: 800 3.5rem/1 var(--pp-font-display); color: var(--ppc-pop-lt); }
.ppc-article__body blockquote p { margin: 0; }
.ppc-article__body ol { padding-left: 1.4rem; }
.ppc-article__body ol > li { margin: .5rem 0; padding-left: .3rem; }
.ppc-article__body ol > li::marker { color: var(--ppc-pop); font-weight: 800; }
.ppc-article__body code { padding: .1rem .35rem; border-radius: 6px; background: var(--ppc-tint-2); font: .9em var(--pp-font-mono); }
.ppc-article__body p:first-child strong:first-child, .ppc-article__body p strong:only-child { color: var(--ppc-ink); }
.ppc-article__body > p:nth-of-type(2):has(> strong:first-child) {
	padding: 1.1rem 1.3rem; border-radius: 14px; border-left: 4px solid var(--ppc-pop); background: rgba(255, 255, 255, .85); box-shadow: var(--ppc-shadow);
}
.ppc-article__sources-title { font-size: 1.1rem !important; }
.ppc-article__sources { font-size: .9rem; }
.ppc-article__sources a { word-break: break-word; }
.ppc-inline-cta {
	position: relative; isolation: isolate; overflow: hidden; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.25rem;
	margin: 2.5rem 0; padding: 1.4rem 1.5rem; border-radius: 18px; color: #fff;
	background: linear-gradient(120deg, #1E1230, #2A1B3D 45%, #6D28D9);
}
.ppc-inline-cta > div { flex: 1 1 14rem; }
.ppc-inline-cta .ppc-strip__title { font-size: 1.15rem; color: #fff; }
.ppc-inline-cta .ppc-strip__text { color: rgba(255, 255, 255, .75); font-size: .92rem; margin: .2rem 0 0; }
.ppc-related { padding-top: 0; }
@media (prefers-reduced-motion: reduce) { .ppc-art__orb { animation: none; } }
.ppc-post__media { overflow: hidden; background: var(--ppc-deep); }
.ppc-post__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ppc-ease); }
.ppc-post:hover .ppc-post__media img { transform: scale(1.04); }
.ppc-article__hero { margin: 0 0 2rem; border-radius: 18px; overflow: hidden; box-shadow: 0 30px 60px -30px rgba(76, 29, 149, .6); }
.ppc-article__hero img { display: block; width: 100%; height: auto; }
.ppc-art--company { --c1: #2A1B3D; --c2: #7B4FA0; --c3: #F5D0FE; }
.ppc-quote__avatar .ppc-icon { width: 1.15rem; height: 1.15rem; }
.ppc-quote figcaption strong { text-transform: none; }

/* Performance: the browser skips layout and paint for sections well below the
   fold until they're about to scroll into view. Content stays in the page for
   search, find-in-page and screen readers; "auto" remembers each real height. */
main > section ~ section ~ section,
.ppc-page > section ~ section ~ section,
.ppc-footer {
	content-visibility: auto;
	contain-intrinsic-size: auto 800px;
}
@media (max-width: 760px) {
	main > section ~ section ~ section,
	.ppc-page > section ~ section ~ section,
	.ppc-footer { contain-intrinsic-size: auto 1400px; }
}