/* ==========================================================================
   PPC landers, Standard v1 (Digital Elements plugin).
   The only stylesheet on a lander besides Gravity Forms' and the theme's own
   ppc-lp/ppc-lp.css, which loads after this one: a site sets its brand there by
   overriding the --lp-* tokens below (colors, fonts) and adds anything of its own.
   Built from Excel Treatment Center's lander (2026-09/10).
   ========================================================================== */

:root {
	/* brand: Excel's values as the defaults; each site sets its own in theme ppc-lp/ppc-lp.css */
	--lp-brand:         #265A9C;  /* brand blue: Call button, links, eyebrows */
	--lp-brand-dark:    #14304F;  /* navy grounds: hero, footer, bottom CTA */
	--lp-brand-hover:   #1B4275;
	--lp-brand-pale:    #DCEAF7;  /* sky tint: alternating bands, icon tiles */

	--lp-accent:        #C1D82F;  /* the field : GRAPHIC ONLY, never behind text */
	--lp-accent-dark:   #B0C726;
	--lp-accent-warm:   #F7D046;  /* the sun : glow + focus rings only */

	--lp-form-cta:      #22E56B;  /* reserved for the GF submit button only */
	--lp-form-cta-dark: #17C258;

	--lp-ink:        #16202B;
	--lp-gray:       #51616F;
	--lp-gray-light: #F4F7FA;
	--lp-line:       #DDE5EC;
	--lp-white:      #FFFFFF;

	/* fonts: the site loads its own (theme ppc-lp/sections/head.php) and names them here */
	--lp-font-head: system-ui, -apple-system, 'Segoe UI', sans-serif;
	--lp-font-body: system-ui, -apple-system, 'Segoe UI', sans-serif;

	--lp-max-w:  1160px;

	/* lp-only additions: type scale, layout rhythm, shape, motion */
	--lp-ink-invert:   #ffffff;
	--lp-body-invert:  rgba(255, 255, 255, .82);
	--lp-muted:        #5E6E7B;  /* darkened from #6B7A87: that failed AA at 4.41:1 on white, this is 5.26:1 */
	--lp-muted-invert: #B9C7D6;

	--lp-fs-h1:      clamp(2.125rem, 1.3rem + 2.5vw, 3.375rem);
	--lp-fs-h2:      clamp(1.75rem, 1.35rem + 1.3vw, 2.375rem);
	--lp-fs-h3:      clamp(1.125rem, 1.05rem + .25vw, 1.25rem);
	--lp-fs-h4:      1.0625rem;
	--lp-fs-lead:    clamp(1.0625rem, 1rem + .2vw, 1.1875rem);
	--lp-fs-body:    1.0625rem;
	--lp-fs-sm:      .9375rem;
	--lp-fs-xs:      .8125rem;
	--lp-fs-eyebrow: .75rem;
	--lp-fs-btn:     1.0625rem;
	--lp-fs-btn-sm:  .9375rem;

	--lp-lh-tight: 1.12;
	--lp-lh-head:  1.20;
	--lp-lh-snug:  1.45;
	--lp-lh-body:  1.65;

	--lp-ls-h1:      -.02em;
	--lp-ls-h2:      -.02em;   /* tightened for Poppins' wider set, matching H1 */
	--lp-ls-eyebrow: .1em;

	--lp-measure:      68ch;
	--lp-measure-lead: 54ch;
	--lp-measure-faq:  76ch;

	--lp-gut:   clamp(20px, 4vw, 32px);
	--lp-hdr-h: 72px;
	--lp-bar-h: 68px;

	--lp-section-y:    clamp(56px, 7vw, 96px);   /* matches de-space-section */
	--lp-section-y-lg: clamp(76px, 8.5vw, 120px);
	--lp-section-y-sm: clamp(28px, 3.5vw, 44px);
	--lp-head-gap:     clamp(32px, 4vw, 56px);
	--lp-grid-gap:     clamp(16px, 2vw, 28px);
	--lp-split-gap:    clamp(32px, 5vw, 72px);
	--lp-card-pad:     clamp(24px, 2.5vw, 32px);

	/* pill buttons, 18px card radius : matches the rebuild's --lp-radius and
	   its 999px .de-btn shape exactly, so both stylesheets speak one language. */
	--lp-radius-pill: 999px;
	--lp-radius:      18px;
	--lp-radius-sm:   12px;

	--lp-shadow-sm:   0 6px 22px rgba(20, 48, 79, .10);
	--lp-shadow:      0 18px 50px rgba(20, 48, 79, .16);
	--lp-shadow-lift: 0 22px 60px rgba(20, 48, 79, .20);
	--lp-shadow-bar:  0 -6px 22px rgba(20, 48, 79, .14);
	--lp-hairline:    inset 0 0 0 1px var(--lp-line);

	--lp-t:      180ms cubic-bezier(.4, 0, .2, 1);
	--lp-t-slow: 280ms cubic-bezier(.4, 0, .2, 1);
	--lp-focus:  var(--lp-brand);
}

/* --------------------------------------------------------------------------
   Reset. Brivona/Elementor and any mu-plugin (etc-header-fix.php) inject
   inline CSS that survives the style-queue nuke, so sizing is set explicitly.
   -------------------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-padding-top: calc(var(--lp-hdr-h) + 16px);
}
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

body {
	margin: 0;
	font-family: var(--lp-font-body);
	font-size: var(--lp-fs-body);
	line-height: var(--lp-lh-body);
	color: var(--lp-gray);
	background: var(--lp-white);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}
body.lp-noscroll { overflow: hidden; }

h1, h2, h3, h4 {
	font-family: var(--lp-font-head);
	color: var(--lp-ink);
	margin: 0;
	font-weight: 600;
}
h1 { font-size: var(--lp-fs-h1); line-height: var(--lp-lh-tight); letter-spacing: var(--lp-ls-h1); font-weight: 600; }
h2 { font-size: var(--lp-fs-h2); line-height: var(--lp-lh-head); letter-spacing: var(--lp-ls-h2); }
h3 { font-size: var(--lp-fs-h3); line-height: 1.25; }
h4 { font-size: var(--lp-fs-h4); line-height: 1.30; }

p { margin: 0; }
p + p { margin-top: 1em; }

/* height:auto is load-bearing : WordPress emits width/height attributes,
   which map to definite CSS height and would otherwise beat aspect-ratio. */
img, svg { max-width: 100%; height: auto; display: block; }
ul, ol { margin: 0; padding: 0; list-style: none; }

a { color: var(--lp-brand); text-decoration: none; }
a:hover { text-decoration: underline; }

:focus-visible {
	outline: 3px solid var(--lp-focus);
	outline-offset: 3px;
	border-radius: 3px;
}
.lp-band--navy :focus-visible,
.lp-footer :focus-visible { outline-color: var(--lp-accent-warm); }

.lp-sr {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.lp-skip {
	position: absolute; left: 12px; top: -60px; z-index: 200;
	background: var(--lp-brand-dark); color: #fff; padding: 12px 20px;
	border-radius: var(--lp-radius-sm); font-weight: 700; transition: top var(--lp-t);
}
.lp-skip:focus { top: 12px; outline: 3px solid var(--lp-accent-warm); outline-offset: 2px; }


/* --------------------------------------------------------------------------
   Primitives
   -------------------------------------------------------------------------- */

.lp-container { width: 100%; max-width: var(--lp-max-w); margin-inline: auto; padding-inline: var(--lp-gut); }

.lp-section { padding-block: var(--lp-section-y); }
.lp-band--white { background: var(--lp-white); }
.lp-band--sky   { background: var(--lp-gray-light); }
.lp-band--gray  { background: var(--lp-gray-light); }

.lp-band--navy {
	/* A warm sun-glow (upper right) against the brand navy, echoing the
	   rebuild's hero without borrowing its exact gradient. Lime never sits
	   behind text, so it appears only as a thin edge glow here. */
	background:
		radial-gradient(120% 90% at 88% 6%, rgba(247, 208, 70, .16) 0%, rgba(247, 208, 70, 0) 55%),
		radial-gradient(90% 80% at 6% 100%, rgba(193, 216, 47, .10) 0%, rgba(193, 216, 47, 0) 60%),
		linear-gradient(164deg, #1c3f66 0%, var(--lp-brand-dark) 45%, #0d2138 100%);
	color: var(--lp-body-invert);
}
.lp-band--navy h1,
.lp-band--navy h2,
.lp-band--navy h3 { color: var(--lp-ink-invert); }

.lp-eyebrow {
	display: flex;
	align-items: center;
	gap: 12px;
	font-family: var(--lp-font-body);
	font-size: var(--lp-fs-eyebrow);
	font-weight: 700;
	letter-spacing: var(--lp-ls-eyebrow);
	text-transform: uppercase;
	color: var(--lp-brand);
	margin: 0 0 14px;
	line-height: 1;
}
.lp-eyebrow::after { content: ""; flex: 1 1 auto; height: 1px; background: var(--lp-line); }
.lp-head--center .lp-eyebrow { justify-content: center; }
.lp-head--center .lp-eyebrow::before { content: ""; flex: 1 1 auto; height: 1px; background: var(--lp-line); order: -1; }
.lp-band--navy .lp-eyebrow,
.lp-eyebrow--light { color: #fff; }
.lp-band--navy .lp-eyebrow::after,
.lp-band--navy .lp-eyebrow::before { background: rgba(255, 255, 255, .3); }

.lp-head { margin-bottom: var(--lp-head-gap); }
.lp-head--center { text-align: center; max-width: 760px; margin-inline: auto; }
.lp-head__sub { margin-top: 16px; font-size: var(--lp-fs-lead); max-width: var(--lp-measure-lead); }
.lp-head--center .lp-head__sub { margin-inline: auto; }

/* Buttons : pill shape, matching the rebuild's .de-btn exactly. */
.lp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-family: var(--lp-font-body);
	font-size: var(--lp-fs-btn);
	font-weight: 700;
	line-height: 1;
	padding: 16px 28px;
	border-radius: var(--lp-radius-pill);
	border: 2px solid transparent;
	cursor: pointer;
	transition: background var(--lp-t), border-color var(--lp-t), color var(--lp-t), transform var(--lp-t), box-shadow var(--lp-t);
	text-align: center;
}
.lp-btn:hover { text-decoration: none; transform: translateY(-2px); }
.lp-btn svg { width: 18px; height: 18px; flex: none; fill: currentColor; }

/* Call : the stronger colour, brand blue solid. */
.lp-btn--call {
	background: var(--lp-accent);
	border-color: var(--lp-accent);
	color: var(--lp-ink);
	box-shadow: 0 6px 18px rgba(193, 216, 47, .35);
}
.lp-btn--call:hover { background: var(--lp-accent-dark); border-color: var(--lp-accent-dark); }

/* Verify : solid brand blue everywhere (header, hero, sections, action bar, form
   card): Call is now the lime primary, Verify is the blue secondary. Both
   .lp-btn--verify (white-bg contexts) and .lp-btn--verify-invert (navy-band
   contexts) render identically by design - kept as two class names only so the
   markup still documents which band each button lives on. Ink-on-lime and
   white-on-#265A9C both clear AA with room (8.9:1 / 8.6:1+). */
.lp-btn--verify,
.lp-btn--verify-invert {
	background: var(--lp-brand);
	border-color: var(--lp-brand);
	color: #fff;
}
.lp-btn--verify:hover,
.lp-btn--verify-invert:hover { background: var(--lp-brand-hover); border-color: var(--lp-brand-hover); color: #fff; }

.lp-btn--sm { font-size: var(--lp-fs-btn-sm); padding: 11px 20px; }
.lp-btn--stack { padding: 13px 26px; text-align: left; }
.lp-btn--stack .lp-btn__lines { display: flex; flex-direction: column; gap: 3px; }
.lp-btn__main { font-size: var(--lp-fs-btn); line-height: 1.2; }
.lp-btn__sub { font-size: var(--lp-fs-xs); font-weight: 500; opacity: .82; line-height: 1.2; }
.lp-btn--block { width: 100%; }

.lp-ctarow { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.lp-hero__actions .lp-ctarow { margin-top: 0; gap: 12px; }
.lp-ctarow--center { justify-content: center; margin-top: clamp(36px, 4vw, 52px); }

/* Phone numerals stay one unbroken text node so CallTrackingMetrics can find
   and swap the number (site is on CTM per the live install's active plugins). */
.lp-tel { font-family: var(--lp-font-body); font-weight: 700; font-variant-numeric: tabular-nums; }

/* "Available 24/7" pulsating dot : hero trust row, header, bottom CTA only. */
.lp-live { display: inline-flex; align-items: center; gap: 8px; font-size: var(--lp-fs-sm); font-weight: 600; }
.lp-dot { position: relative; width: 10px; height: 10px; border-radius: 50%; background: var(--lp-form-cta); flex: none; }
.lp-dot::after {
	content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--lp-form-cta);
	animation: lp-ping 1.6s cubic-bezier(0, 0, .2, 1) infinite;
}
@keyframes lp-ping { 75%, 100% { transform: scale(2.4); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .lp-dot::after { animation: none; } }
.lp-band--navy .lp-live { color: var(--lp-body-invert); }

/* --------------------------------------------------------------------------
   Sticky header : tablet/desktop. Logo-only, non-sticky on phones (the
   action bar carries the CTAs there). Breakpoint chosen for THIS logo/number:
   "Excel Treatment Center" wordmark + "(609) 798-0319" + Verify button need
   ~640px to share one row without crowding : set below at 720px.
   -------------------------------------------------------------------------- */

/* Matches the DE rebuild's own .de-header (blocks.css): flat --lp-brand-dark,
   white text, no white bar. The hero starts navy immediately below, so no shadow
   by default (a shadow was designed for a white bar sitting above white content) -
   just a hairline so the two navy surfaces still read as two distinct layers
   rather than one seamless blob if their exact tones ever drift apart. */
.lp-header {
	position: sticky; top: 0; z-index: 60;
	background: var(--lp-brand-dark);
	border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.lp-header__inner { height: var(--lp-hdr-h); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.lp-header__logo { display: inline-flex; align-items: center; gap: 10px; }
.lp-header__logo img { height: 48px; width: auto; flex: none; }
.lp-header__word {
	font-family: var(--lp-font-head);
	font-size: 1.1875rem;
	font-weight: 600;
	color: #fff;
	line-height: 1;
	white-space: nowrap;
}
.lp-header__actions { display: none; align-items: center; gap: 18px; }
/* Font-family/weight/size copied verbatim from the rebuild's .de-header__phone -
   no icon, matching how the rebuild itself sets the phone in its navy header. */
.lp-header__tel {
	display: inline-flex; align-items: center;
	font-family: var(--lp-font-head); font-weight: 600; font-size: 19px;
	color: #fff; text-decoration: none;
}
.lp-header__tel:hover { color: rgba(255, 255, 255, .8); text-decoration: none; }
.lp-header__live { font-family: var(--lp-font-head); font-size: var(--lp-fs-xs); font-weight: 600; color: rgba(255, 255, 255, .78); }
.lp-header__live .lp-dot { width: 8px; height: 8px; }

@media (min-width: 720px) {
	.lp-header__actions { display: flex; }
}

/* --------------------------------------------------------------------------
   1. Hero
   -------------------------------------------------------------------------- */

.lp-hero { padding-block: var(--lp-section-y-lg); overflow: hidden; }

.lp-hero--bg {
	position: relative;
	/* George's storefront photo has white signage ("excel behavioral health" on the
	   awning, "excel treatment center" on both windows) that competed with the white
	   hero copy. Two fixes, tuned against 1440/1280/1024/900 and pixel-sampled for
	   contrast: (1) push background-position toward the right edge of the photo,
	   which on this container is the clearest area (the white pillar/planters), (2)
	   a uniform navy wash (flat linear-gradient, ~50% here) so any signage that
	   still lands under the copy column reads as muted texture, layered under a
	   PIXEL-stopped (not %) left-to-right gradient so the darkest zone always covers
	   the fixed 660px copy column regardless of viewport width. */
	background-image: linear-gradient(90deg, rgba(11, 28, 48, .8) 0px, rgba(13, 32, 54, .975) 620px, rgba(18, 44, 74, .8) 850px, rgba(26, 60, 98, .62) 1150px 1440px), var(--hero-bg);
	background-size: 100% 100%, cover;
	background-position: center, 70% center;
	background-repeat: no-repeat, no-repeat;
}
.lp-hero__inner { position: relative; z-index: 1; }
.lp-hero__copy { max-width: 660px; }
.lp-hero__lead { font-size: var(--lp-fs-lead); line-height: 1.60; color: var(--lp-body-invert); margin-top: 20px; max-width: var(--lp-measure-lead); }
.lp-hero__actions { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 22px; margin-top: 34px; }

.lp-hero__trust { flex: 1 1 100%; display: flex; justify-content: flex-start; }
.lp-hero__seals { display: flex; align-items: center; justify-content: flex-start; gap: 18px; flex-wrap: wrap; }
.lp-hero__seal { height: 56px; width: auto; flex: none; filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .35)); }
.lp-hero__seal--tall { height: 64px; }

/* --------------------------------------------------------------------------
   Admission process
   -------------------------------------------------------------------------- */

.lp-steps__grid { display: grid; gap: clamp(30px, 3.4vw, 40px); }
.lp-step { text-align: center; }
.lp-step__icon {
	position: relative; width: 76px; height: 76px; margin: 0 auto 20px;
	border-radius: 50%; background: var(--lp-brand-pale); color: var(--lp-brand);
	display: grid; place-items: center;
}
.lp-step__icon svg { width: 32px; height: 32px; fill: currentColor; stroke: none; }
.lp-step__num {
	position: absolute; top: 2px; left: 2px; width: 27px; height: 27px;
	border-radius: 50%; background: var(--lp-brand); color: #fff; border: 3px solid var(--lp-white);
	font-size: .8125rem; font-weight: 700; line-height: 1; display: grid; place-items: center;
}
.lp-step h3 { margin-bottom: 10px; }
.lp-step p { font-size: var(--lp-fs-sm); line-height: 1.60; max-width: 32ch; margin-inline: auto; }

@media (min-width: 560px) { .lp-steps__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1120px) { .lp-steps__grid { grid-template-columns: repeat(4, 1fr); } }

/* --------------------------------------------------------------------------
   Insurance banner : directly below the hero.
   -------------------------------------------------------------------------- */

.lp-insbar { background: var(--lp-gray-light); border-bottom: 1px solid var(--lp-line); padding-block: clamp(22px, 2.6vw, 30px); }
.lp-insbar__inner { text-align: center; }
.lp-insbar__label {
	font-size: 1rem; font-weight: 700; letter-spacing: var(--lp-ls-eyebrow);
	text-transform: uppercase; color: var(--lp-muted); line-height: 1.3;
}
.lp-insbar__rule { width: 48px; height: 1px; background: var(--lp-line); margin: 14px auto 22px; }
/* Marquee: two copies of .lp-insbar__row sit side by side in the track; the
   track animates the full width of ONE copy (-50%) so the loop is seamless.
   The second copy is aria-hidden so screen readers see each carrier once. */
.lp-marquee { overflow: hidden; }
.lp-marquee__track {
	display: flex;
	width: max-content;
	animation: lp-marquee 34s linear infinite;
}
.lp-marquee:hover .lp-marquee__track,
.lp-marquee:focus-within .lp-marquee__track { animation-play-state: paused; }
@keyframes lp-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
.lp-insbar__row { display: flex; flex-wrap: nowrap; align-items: center; gap: clamp(28px, 3.6vw, 52px); padding-inline: clamp(14px, 3vw, 26px); }
.lp-insbar__row li { display: flex; align-items: center; flex: none; }
.lp-insbar__row img { height: 44px; width: auto; max-width: 148px; object-fit: contain; filter: grayscale(1); opacity: .62; }
@media (prefers-reduced-motion: reduce) {
	.lp-marquee__track { animation: none; width: 100%; }
	.lp-insbar__row { flex-wrap: wrap; justify-content: center; padding-inline: 0; }
	.lp-marquee__track .lp-insbar__row[aria-hidden] { display: none; }
}

@media (max-width: 559px) {
	.lp-insbar__row img { height: 32px; max-width: 108px; }
	.lp-insbar__row { gap: 20px; }
}

/* --------------------------------------------------------------------------
   About / Why Excel
   -------------------------------------------------------------------------- */

.lp-about__grid { display: grid; gap: var(--lp-split-gap); align-items: center; }
.lp-about__text { margin-top: 18px; max-width: var(--lp-measure); }
.lp-about__media img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--lp-radius); box-shadow: var(--lp-shadow-sm); }

.lp-beliefs { margin-top: 28px; display: grid; gap: 0; }
.lp-beliefs li {
	display: grid; grid-template-columns: 22px 1fr; gap: 12px; align-items: start;
	padding: 14px 0; border-top: 1px solid var(--lp-line);
	font-weight: 600; color: var(--lp-ink); line-height: var(--lp-lh-snug);
}
.lp-beliefs li:last-child { border-bottom: 1px solid var(--lp-line); }
.lp-beliefs__tick { width: 22px; height: 22px; border-radius: 7px; margin-top: 2px; background: var(--lp-accent); position: relative; flex: none; }
.lp-beliefs__tick::after {
	content: ""; position: absolute; left: 7px; top: 4px;
	width: 6px; height: 11px; border: solid var(--lp-ink);
	border-width: 0 2px 2px 0; transform: rotate(45deg);
}

/* --------------------------------------------------------------------------
   What we treat
   -------------------------------------------------------------------------- */

.lp-conditions__grid { display: grid; gap: var(--lp-grid-gap); }
.lp-cond {
	background: #fff; border-radius: var(--lp-radius); padding: var(--lp-card-pad);
	box-shadow: var(--lp-hairline); transition: box-shadow var(--lp-t), transform var(--lp-t);
}
.lp-cond:hover { box-shadow: var(--lp-shadow-sm); transform: translateY(-2px); }
.lp-cond__icon {
	width: 44px; height: 44px; border-radius: var(--lp-radius-sm); background: var(--lp-brand-pale);
	color: var(--lp-brand); display: grid; place-items: center; margin: 0 auto 18px;
}
.lp-cond__icon svg { width: 24px; height: 24px; fill: currentColor; stroke: currentColor; }
.lp-cond h3 { margin-bottom: 10px; text-align: center; }
.lp-cond p { font-size: var(--lp-fs-sm); line-height: 1.60; }

/* --------------------------------------------------------------------------
   Programs & Levels of Care
   -------------------------------------------------------------------------- */

.lp-programs__grid { display: grid; gap: var(--lp-grid-gap); }
.lp-prog {
	background: #fff; border: 1px solid var(--lp-line); border-radius: var(--lp-radius);
	padding: var(--lp-card-pad); display: flex; flex-direction: column; gap: 16px;
}
.lp-prog__icon {
	width: 40px; height: 40px; border-radius: var(--lp-radius-sm); background: var(--lp-brand-pale);
	color: var(--lp-brand); display: grid; place-items: center; margin-inline: auto;
}
.lp-prog h4 { text-align: center; }
.lp-prog__icon svg { width: 22px; height: 22px; fill: currentColor; stroke: currentColor; }
.lp-prog ul { display: grid; gap: 9px; }
.lp-prog li { position: relative; padding-left: 16px; font-size: var(--lp-fs-sm); line-height: 1.55; }
.lp-prog li::before { content: ""; position: absolute; left: 0; top: .55em; width: 5px; height: 5px; border-radius: 50%; background: var(--lp-brand); }

/* --------------------------------------------------------------------------
   Gallery : simple grid (real facility photos only, 11 in the live library).
   -------------------------------------------------------------------------- */

.lp-gallery__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lp-gallery__item {
	appearance: none; border: 0; padding: 0; margin: 0; background: none; display: block;
	width: 100%; aspect-ratio: 4 / 3; border-radius: 12px; overflow: hidden; cursor: zoom-in;
	position: relative;
}
.lp-gallery__item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform var(--lp-t-slow); }
.lp-gallery__item::after {
	content: ""; position: absolute; inset: 0; background: rgba(20, 48, 79, 0);
	transition: background var(--lp-t);
}
.lp-gallery__item:hover::after, .lp-gallery__item:focus-visible::after { background: rgba(20, 48, 79, .18); }
.lp-gallery__item:hover img, .lp-gallery__item:focus-visible img { transform: scale(1.04); }
.lp-gallery__item:focus-visible { outline: 2px solid var(--lp-brand); outline-offset: 2px; }

@media (min-width: 720px) {
	.lp-gallery__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* --------------------------------------------------------------------------
   Reviews : Trustindex widget
   -------------------------------------------------------------------------- */

.lp-reviews { padding-block: clamp(40px, 4.5vw, 64px); }
.lp-reviews .lp-head { margin-bottom: clamp(20px, 2.5vw, 32px); }
.lp-reviews__widget { min-height: 240px; }

/* --------------------------------------------------------------------------
   Insurance section : carrier grid + form card.
   NOTE: classes are .lp-carrier*, not .insurance-logo* : a sitewide WPCode
   snippet may define the latter and would restyle these unintentionally.
   -------------------------------------------------------------------------- */

.lp-insurance__grid { display: grid; gap: var(--lp-split-gap); align-items: start; }
.lp-carriers { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 28px; }
.lp-carrier {
	background: #fff; border: 1px solid var(--lp-line); border-radius: var(--lp-radius-sm);
	min-height: 80px; padding: 16px 20px; display: grid; place-items: center;
}
.lp-carrier img { max-height: 32px; max-width: 100%; width: auto; object-fit: contain; }
.lp-insurance__note { margin-top: 20px; font-size: var(--lp-fs-sm); }
.lp-insurance__disclaimer { margin-top: 10px; font-size: var(--lp-fs-xs); color: var(--lp-muted); }

.lp-formcard { background: #fff; border-radius: var(--lp-radius); box-shadow: var(--lp-shadow); padding: var(--lp-card-pad); }
.lp-formcard h3 { margin-bottom: 8px; }
.lp-formcard__sub { font-size: var(--lp-fs-sm); margin-bottom: 22px; }
.lp-formcard__alt { margin-top: 18px; text-align: center; font-size: var(--lp-fs-sm); }

/* --------------------------------------------------------------------------
   FAQ : native <details>
   -------------------------------------------------------------------------- */

.lp-faq__list { max-width: 820px; margin-inline: auto; }
.lp-faq__item { border-top: 1px solid var(--lp-line); }
.lp-faq__item:last-child { border-bottom: 1px solid var(--lp-line); }
.lp-faq__q {
	display: flex; align-items: center; justify-content: space-between; gap: 20px; cursor: pointer;
	list-style: none; padding: 20px 4px; min-height: 44px;
	font-family: var(--lp-font-head); font-size: 1.0625rem; font-weight: 600; line-height: 1.40; color: var(--lp-ink);
}
.lp-faq__q::-webkit-details-marker { display: none; }
.lp-faq__q:hover { color: var(--lp-brand); }
.lp-faq__ico { position: relative; width: 14px; height: 14px; flex: none; }
.lp-faq__ico::before, .lp-faq__ico::after { content: ""; position: absolute; background: var(--lp-brand); border-radius: 2px; transition: transform var(--lp-t), opacity var(--lp-t); }
.lp-faq__ico::before { left: 6px; top: 0; width: 2px; height: 14px; }
.lp-faq__ico::after  { left: 0; top: 6px; width: 14px; height: 2px; }
.lp-faq__item[open] .lp-faq__ico::before { transform: scaleY(0); opacity: 0; }
.lp-faq__a { padding: 0 4px 24px; max-width: var(--lp-measure-faq); font-size: var(--lp-fs-body); line-height: var(--lp-lh-body); }
.lp-faq__item[open] .lp-faq__a { animation: lp-faq-in 200ms ease-out; }
@keyframes lp-faq-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.lp-faq__foot { text-align: center; margin-top: 36px; font-size: var(--lp-fs-sm); }

/* --------------------------------------------------------------------------
   Bottom hero CTA
   -------------------------------------------------------------------------- */

.lp-cta { padding-block: var(--lp-section-y-lg); text-align: center; }
.lp-cta--bg {
	position: relative;
	background-image:
		radial-gradient(90% 80% at 12% 12%, rgba(247, 208, 70, .16) 0%, rgba(247, 208, 70, 0) 55%),
		linear-gradient(338deg, rgba(13, 33, 56, .90) 0%, rgba(20, 48, 79, .84) 55%, rgba(28, 63, 102, .70) 100%),
		var(--cta-bg);
	background-size: cover, cover, cover;
	background-position: center, center, center;
	background-repeat: no-repeat, no-repeat, no-repeat;
	color: var(--lp-body-invert);
}
.lp-cta--bg h2 { color: var(--lp-ink-invert); }
.lp-cta__text { margin-top: 20px; max-width: var(--lp-measure); margin-inline: auto; font-size: var(--lp-fs-lead); line-height: 1.60; }
.lp-cta__live { margin-top: 20px; justify-content: center; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.lp-footer { background: var(--lp-brand-dark); color: var(--lp-body-invert); padding-block: var(--lp-section-y-sm); font-size: var(--lp-fs-sm); }
.lp-footer__inner { display: grid; gap: 24px; align-items: center; text-align: center; }
.lp-footer__brand { display: inline-flex; align-items: center; gap: 10px; }
.lp-footer__brand img { height: 34px; width: auto; flex: none; }
.lp-footer__word { font-family: var(--lp-font-head); font-size: 1.0625rem; font-weight: 600; color: #fff; }
.lp-footer a { color: #fff; text-decoration: underline; }
.lp-footer__badges { display: flex; align-items: center; justify-content: center; gap: 20px; flex-wrap: wrap; }
.lp-footer__badges img { height: 58px; width: auto; }
.lp-footer__legal { font-size: var(--lp-fs-xs); color: var(--lp-muted-invert); line-height: 1.6; }

/* --------------------------------------------------------------------------
   Mobile action bar (phones only : no desktop floating call button)
   -------------------------------------------------------------------------- */

.lp-actionbar {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 55;
	background: #fff; box-shadow: var(--lp-shadow-bar);
	padding: 10px var(--lp-gut); padding-bottom: max(10px, env(safe-area-inset-bottom));
	display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
}

@media (min-width: 720px) { .lp-actionbar { display: none; } }
@media (max-width: 719px) { body { padding-bottom: calc(var(--lp-bar-h) + 12px); } }


/* --------------------------------------------------------------------------
   Gallery lightbox : ported from the rebuild's .de-lightbox (blocks.css),
   same component and behaviour as /about/center/'s facility gallery.
   -------------------------------------------------------------------------- */

.lp-lightbox {
	position: fixed; inset: 0; z-index: 999; display: grid; place-items: center;
	background: rgba(10, 20, 32, .92); opacity: 0; visibility: hidden;
	transition: opacity var(--lp-t);
	padding: 60px 20px;
}
.lp-lightbox.is-open { opacity: 1; visibility: visible; }
.lp-lightbox__img {
	max-width: min(1100px, 92vw); max-height: 84vh; width: auto; height: auto;
	object-fit: contain; border-radius: 8px; box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
}
.lp-lightbox__close, .lp-lightbox__prev, .lp-lightbox__next {
	position: fixed; appearance: none; border: 0; cursor: pointer;
	background: rgba(255, 255, 255, .1); color: #fff;
	display: grid; place-items: center; border-radius: 999px;
	transition: background var(--lp-t);
}
.lp-lightbox__close:hover, .lp-lightbox__prev:hover, .lp-lightbox__next:hover { background: rgba(255, 255, 255, .22); }
.lp-lightbox__close { top: 20px; right: 20px; width: 44px; height: 44px; font-size: 22px; line-height: 1; }
.lp-lightbox__prev, .lp-lightbox__next { top: 50%; transform: translateY(-50%); width: 52px; height: 52px; font-size: 26px; }
.lp-lightbox__prev { left: 16px; }
.lp-lightbox__next { right: 16px; }
@media (max-width: 620px) {
	.lp-lightbox__prev, .lp-lightbox__next { width: 42px; height: 42px; font-size: 20px; }
}

/* --------------------------------------------------------------------------
   Modal
   -------------------------------------------------------------------------- */

.lp-modal {
	display: none; position: fixed; inset: 0; z-index: 100;
	background: rgba(13, 33, 56, .58); padding: var(--lp-gut); overflow-y: auto; backdrop-filter: blur(2px);
}
.lp-modal.is-open { display: flex; align-items: flex-start; justify-content: center; }
.lp-modal__panel {
	background: #fff; border-radius: var(--lp-radius); box-shadow: var(--lp-shadow-lift);
	width: 100%; max-width: 880px; margin: auto; padding: clamp(24px, 3vw, 36px); position: relative;
}
.lp-modal__close {
	position: absolute; top: 10px; right: 10px; width: 44px; height: 44px; border: 0; border-radius: 50%;
	background: var(--lp-brand-pale); color: var(--lp-ink); font-size: 22px; line-height: 1; cursor: pointer;
	display: grid; place-items: center; transition: background var(--lp-t);
}
.lp-modal__close:hover { background: var(--lp-line); }
.lp-modal h3 { margin-bottom: 8px; padding-right: 40px; }
.lp-modal__sub { font-size: var(--lp-fs-sm); margin-bottom: 20px; }
.lp-modal__disclaimer { margin-top: 11px; font-size: var(--lp-fs-xs); color: var(--lp-muted); text-align: center; }

/* Post-submission thank-you (?submission=success) */
.lp-success { text-align: center; padding: 8px 0 4px; }
.lp-success__mark {
	display: grid; place-items: center; width: 60px; height: 60px; margin: 0 auto 20px; border-radius: 50%;
	background: rgba(34, 229, 107, .14); color: var(--lp-form-cta-dark);
}
.lp-success__mark svg { width: 30px; height: 30px; fill: currentColor; }
.lp-success h3 { margin-bottom: 12px; }
.lp-success p { max-width: 46ch; margin-inline: auto; }
.lp-success__now { margin-top: 24px; font-size: var(--lp-fs-sm); color: var(--lp-muted); margin-bottom: 14px; }

/* --------------------------------------------------------------------------
   Gravity Forms : theme/plugin CSS is stripped by the queue reset, GF's own
   3 stylesheets (form/basic/theme) still load for the datepicker + fieldset.
   -------------------------------------------------------------------------- */

.gform_required_legend { display: none; }
.gform_wrapper form { margin: 0; }
/* Standard: GF's vertical field gap inside the modal is always 20px. The custom
   property is GF's own theme-framework token (covers both gravity-theme and
   gform-theme--orbital markup); row-gap below is the fallback for legacy GF
   markup that doesn't read the variable at all. */
#verifyModal .gform_wrapper,
#verifyModal .gform_wrapper.gravity-theme,
#verifyModal .gform_wrapper.gform-theme--orbital {
	--gf-form-gap-y: 20px;
}
.gform_wrapper .gform_fields { display: grid; grid-template-columns: 1fr; column-gap: 12px; row-gap: 20px; margin: 0; padding: 0; list-style: none; }
.gform_wrapper .gfield { min-width: 0; }
.gform_wrapper .gfield_label { display: block; font-size: var(--lp-fs-sm); font-weight: 600; color: var(--lp-ink); margin-bottom: 5px; line-height: 1.35; }
.gform_wrapper .gfield_required { color: #c2384a; margin-left: 3px; }

.gform_wrapper input[type=text],
.gform_wrapper input[type=email],
.gform_wrapper input[type=tel],
.gform_wrapper input[type=number],
.gform_wrapper input[type=date],
.gform_wrapper select,
.gform_wrapper textarea {
	width: 100%; font-size: 16px; line-height: 1.4; color: var(--lp-ink);
	padding: 9px 12px; background: var(--lp-gray-light); border: 1.5px solid var(--lp-line);
	border-radius: var(--lp-radius-sm); transition: border-color var(--lp-t), box-shadow var(--lp-t), background var(--lp-t);
	-webkit-appearance: none; appearance: none;
}
.gform_wrapper input:focus, .gform_wrapper select:focus, .gform_wrapper textarea:focus {
	outline: none; background: #fff; border-color: var(--lp-brand); box-shadow: 0 0 0 3px rgba(38, 90, 156, .14);
}
.gform_wrapper ::placeholder { color: var(--lp-muted); opacity: 1; }

.gform_wrapper .ginput_complex { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.gform_wrapper .ginput_complex span { display: block; min-width: 0; }
.gform_wrapper .ginput_complex label { display: block; font-size: var(--lp-fs-xs); color: var(--lp-muted); margin-top: 5px; }
.gform_wrapper .datepicker { max-width: 100%; }

/* Date of Birth spans the full form column, matching the other text inputs
   (Standard 16). Only the container/input, never the datepicker popup. */
#verifyModal .ginput_container_date,
#verifyModal .ginput_container_date input { width: 100%; max-width: none; }

.gform_wrapper .gform_validation_container,
.gform_wrapper .gfield--type-honeypot,
.gform_wrapper li.gform_validation_container,
.gform_wrapper .gfield_visibility_hidden { display: none !important; }

.gform_wrapper .screen-reader-text,
.gform_wrapper .gfield_description.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.gform_wrapper fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.gform_wrapper legend.gfield_label { padding: 0; display: block; width: 100%; float: none; }
.gform_wrapper fieldset > .ginput_container { clear: both; width: 100%; }

.gform_wrapper .gfield_required { font-size: var(--lp-fs-xs); font-weight: 500; color: var(--lp-muted); margin-left: 4px; }
/* Required marker: a plain asterisk, not GF's "(Required)" text (Standard 16).
   Text stays in the DOM (font-size:0, not display:none) so screen readers
   still announce it; sighted users see the asterisk only. */
.gform_wrapper .gfield_required_text { font-size: 0; margin-left: 4px; }
.gform_wrapper .gfield_required_text::after { content: "*"; font-size: 1rem; font-weight: 700; color: #c2384a; }

/* Re-asserted with !important : Gravity Forms' theme CSS loads after this
   file and would otherwise zero border-radius inside the modal. */
#verifyModal .gform_wrapper .gfield input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]),
#verifyModal .gform_wrapper .gfield select,
#verifyModal .gform_wrapper .gfield textarea {
	padding: 10px 13px !important; font-size: 16px !important; line-height: 1.4 !important; min-height: 0 !important;
	border-radius: var(--lp-radius-sm) !important; border: 1.5px solid var(--lp-line) !important;
	background-color: var(--lp-gray-light) !important; color: var(--lp-ink) !important; font-family: var(--lp-font-body) !important;
}
#verifyModal .gform_wrapper .gfield input:focus,
#verifyModal .gform_wrapper .gfield select:focus,
#verifyModal .gform_wrapper .gfield textarea:focus {
	background-color: #fff !important; border-color: var(--lp-brand) !important; box-shadow: 0 0 0 3px rgba(38, 90, 156, .14) !important; outline: none !important;
}

/* Date of Birth calendar popup's own year/month nav selects only: the
   blanket field padding/font-size above didn't fit the calendar's fixed
   35px row height, clipping the digits/month name at the top. Tighten
   padding/line-height for just these two selects so text fits, and stop
   Gravity Forms' own :focus background-image icon swap on them too. */
#verifyModal .gform_wrapper .gfield .gform-datepicker-calendar select {
	padding: 6px 24px 4px 10px !important; line-height: 1.2 !important;
}
#verifyModal .gform_wrapper .gfield .gform-datepicker-calendar select:focus {
	background-image: none !important;
}

#verifyModal .gform_wrapper .gfield--type-checkbox,
#verifyModal .gform_wrapper .gfield--width-full { grid-column: 1 / -1; }
#verifyModal .gform_wrapper .ginput_container_checkbox { width: 100%; }

/* Consent layout left to Gravity Forms : custom flex/grid rules here collapse
   the choice text into a narrow column (see template-build.md gotchas). */
.gform_wrapper .gfield_checkbox input[type=checkbox] { accent-color: var(--lp-brand); }
.gform_wrapper .gfield_checkbox label,
.gform_wrapper .gfield_consent label { font-size: .75rem; line-height: 1.5; color: var(--lp-muted); }
.gform_wrapper .gfield_checkbox label a { color: var(--lp-brand); text-decoration: underline; }

.gform_wrapper .gform_footer { margin: 20px 0 0; padding: 0; }

/* The submit button itself is branded via gform_submit_button_{ID} in PHP,
   matching the page's lime Call buttons (--lp-accent) instead of the
   reserved --lp-form-cta green. !important + #verifyModal scoping: Gravity
   Forms orbital theme CSS prints AFTER ppc-lp.css and otherwise wins the
   cascade on .gform_button (same reason the input-field rules below are
   re-asserted the same way). */
#verifyModal .gform_wrapper .gform_footer .gform_button,
#verifyModal button.lp-btn--submit {
	width: 100% !important; background: var(--lp-accent) !important; border-color: var(--lp-accent) !important; color: var(--lp-ink) !important;
	border-radius: var(--lp-radius-pill) !important; font-weight: 700 !important;
	box-shadow: 0 6px 18px rgba(193, 216, 47, .35) !important;
}
#verifyModal .gform_wrapper .gform_footer .gform_button:hover,
#verifyModal button.lp-btn--submit:hover { background: var(--lp-accent-dark) !important; border-color: var(--lp-accent-dark) !important; }

.gform_wrapper .gform_validation_errors {
	background: #fdf2f4; border: 1px solid #f0c4cc; border-radius: var(--lp-radius-sm); padding: 14px 16px;
	margin-bottom: 20px; font-size: var(--lp-fs-sm); color: #8f2233;
}
.gform_wrapper .gform_validation_errors h2 { font-size: var(--lp-fs-sm); color: #8f2233; }
.gform_wrapper .validation_message { font-size: var(--lp-fs-xs); color: #c2384a; margin-top: 6px; }
.gform_wrapper .gfield_error input, .gform_wrapper .gfield_error select { border-color: #c2384a; }

.gform_confirmation_message {
	font-size: var(--lp-fs-body); line-height: var(--lp-lh-body); color: var(--lp-ink);
	background: var(--lp-gray-light); border: 1px solid var(--lp-line); border-left: 3px solid var(--lp-form-cta);
	border-radius: var(--lp-radius-sm); padding: 22px 24px;
}
.gform_wrapper .gform_ajax_spinner { display: inline-block; margin-left: 10px; }
.gform_wrapper .gfield_description { font-size: var(--lp-fs-xs); color: var(--lp-muted); margin-top: 6px; }

/* Standard: modal text sizes step up one notch on desktop widths
   (min-width: 720px). Mobile keeps its current sizes untouched; inputs
   never drop below 16px anywhere (iOS zoom guard). */
@media (min-width: 720px) {
	#verifyModal h3 { font-size: 27px; line-height: 1.2; }
	#verifyModal .lp-modal__sub { font-size: 16px; }
	#verifyModal .lp-modal__disclaimer { font-size: 15px; }
	#verifyModal .gform_wrapper .gfield_label { font-size: 15px; }
	#verifyModal .gform_wrapper .gfield_checkbox label,
	#verifyModal .gform_wrapper .gfield_consent label { font-size: 14px; }
	#verifyModal .gform_wrapper .gfield input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]),
	#verifyModal .gform_wrapper .gfield select,
	#verifyModal .gform_wrapper .gfield textarea {
		font-size: 17px !important;
	}
}

/* --------------------------------------------------------------------------
   Breakpoints.
   -------------------------------------------------------------------------- */

@media (min-width: 560px) { .lp-conditions__grid, .lp-programs__grid { grid-template-columns: repeat(2, 1fr); } }

@media (min-width: 860px) {
	.lp-about__grid { grid-template-columns: 1fr 1fr; }
	.lp-conditions__grid { grid-template-columns: repeat(3, 1fr); }
	.lp-insurance__grid { grid-template-columns: 1.05fr .95fr; }
	.lp-carriers { grid-template-columns: repeat(4, 1fr); }
	.lp-footer__inner { grid-template-columns: auto 1fr auto; text-align: left; }
	.lp-footer__badges { justify-content: flex-end; }
	.gform_wrapper .gform_fields { grid-template-columns: repeat(2, 1fr); }
	.gform_wrapper .gfield--width-full,
	.gform_wrapper .gfield--type-checkbox,
	.gform_wrapper .gfield--type-consent { grid-column: 1 / -1; }
	.lp-formcard { position: sticky; top: calc(var(--lp-hdr-h) + 24px); }
}

@media (min-width: 1120px) { .lp-programs__grid { grid-template-columns: repeat(4, 1fr); } }

/* Mobile header: number/verify button drop, the action bar carries them. */
@media (max-width: 719px) {
	:root {
		--lp-hdr-h: 60px;
		/* vibe_1789735357641_qzafuc44e: 28px (1.75rem) read too small once seen
		   live. Poppins is wider than Fraunces at the same size, so this can't go
		   back to the desktop clamp's 34px floor on plain wrap (5 lines at
		   360-390px with an orphan "Night." alone on the last line); 36px plus
		   `text-wrap: pretty` on the hero H1 below holds it to 5 clean lines with
		   no single-word line at 390 or 360 in Chromium. Browsers without
		   `pretty` support fall back to plain wrap, which brings the single-word
		   "Night." line back as a graceful degradation, not a break. Tight
		   line-height/letter-spacing already come from the global h1 rule
		   (--lp-lh-tight 1.12, --lp-ls-h1 -.02em) - no override needed here. */
		--lp-fs-h1: 2.25rem;
	}
	/* Standard 3: logo-only, non-sticky header on phones (the action bar carries the CTAs). */
	.lp-header { position: static; box-shadow: none; }
	/* vibe_1789736164416_4q0eqpcxt: only .lp-header__logo remains in-flow here
	   (.lp-header__actions is display:none below 720px), so the base
	   space-between rule packs it to the left edge. Center it instead - logo
	   mark + wordmark sit dead center in the header on phones. Desktop (1440,
	   min-width:720px) keeps the base .lp-header__inner rule untouched. */
	.lp-header__inner { justify-content: center; }
	.lp-hero__actions { gap: 22px; margin-top: 26px; }
	/* vibe_1789735357641_qzafuc44e: progressive enhancement only, see the
	   --lp-fs-h1 comment above - browsers without `pretty` just keep plain wrap. */
	.lp-hero__copy h1 { text-wrap: pretty; }
	/* vibe_1789735369623_uobqotlgy: Call/Verify were forced full width and
	   stacked, reading oversized. Auto width (hug content) + left aligned under
	   the copy, matching the left-aligned H1/lead above (the trust row just
	   below is centered on its own - see .lp-hero__trust). .lp-ctarow's base
	   rule already wraps, so both buttons share a row when they fit this column
	   and the second drops to its own row when it doesn't - no extra
	   side-by-side/stacked rule needed. Padding trimmed from the shared
	   13px/26px .lp-btn--stack default so they carry less visual weight without
	   the tap target dropping under 44px. .lp-btn--stack is hero-only (the
	   action bar and bottom CTA use plain .lp-btn--call/.lp-btn--verify), and
	   this whole block only fires under max-width:719px, so neither desktop nor
	   those two are touched. */
	.lp-hero__actions .lp-btn--stack { padding: 12px 20px; }
	/* vibe_1789736152159_2803q18mw: center the Call/Verify row on mobile.
	   .lp-ctarow's flex-wrap means each wrapped line is justified on its own,
	   so this one rule also centers each button when they stack at narrower
	   widths (390) - buttons stay auto-width, only the row's justification
	   changes. Desktop (1440) keeps the base left-aligned .lp-ctarow rule. */
	.lp-hero__actions .lp-ctarow { justify-content: center; }
	/* vibe_1789735345716_zd0isa0d1: desktop stays left aligned (base
	   .lp-hero__trust rule above, set previously); on mobile center the trust
	   row and its seals. */
	.lp-hero__trust { justify-content: center; }
	.lp-hero__seals { justify-content: center; }
	.lp-header__word { font-size: 1.0625rem; }
	.lp-header__logo img { height: 32px; }
	.lp-carriers { grid-template-columns: repeat(2, 1fr); }
	.lp-gallery__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important; animation-iteration-count: 1 !important;
		transition-duration: .01ms !important; scroll-behavior: auto !important;
	}
	.lp-btn:hover, .lp-cond:hover, .lp-gallery__item:hover img { transform: none; }
	.lp-lightbox, .lp-gallery__item, .lp-gallery__item img, .lp-gallery__item::after { transition: none; }
}

@media print {
	.lp-header, .lp-actionbar, .lp-modal { display: none !important; }
}

/* ==========================================================================
   PPC microsite (2026-10-13): header menu on every /ppc/ page + the
   page-ppc-microsite.php pages (Verify Insurance, Treatment Services,
   Contact Us). Nav type matches the main site's .de-nav (blocks.css):
   uppercase 15px/600, white at .88, lime on hover and on the current page.
   ========================================================================== */

.lp-header--nav .lp-header__inner { justify-content: flex-start; }
.lp-header--nav .lp-header__actions { margin-left: clamp(20px, 3vw, 36px); }
/* An <a> with no href (no stored lander yet) is plain text, not a link. */
a.lp-header__logo:not([href]) { cursor: default; }

.lp-nav__list { display: flex; gap: 22px; list-style: none; margin: 0; padding: 0; }
.lp-nav a {
	color: rgba(255, 255, 255, .88);
	font-family: var(--lp-font-body);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .02em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: color var(--lp-t);
}
.lp-nav a:hover,
.lp-nav .current-menu-item > a { color: var(--lp-accent); text-decoration: none; }
.lp-nav { margin-left: auto; }

.lp-nav-toggle {
	display: none;
	width: 44px; height: 44px; padding: 0; margin-left: 12px; flex: none;
	border: 2px solid rgba(255, 255, 255, .4); border-radius: 12px;
	background: transparent; color: #fff; cursor: pointer;
}
.lp-nav-toggle span,
.lp-nav-toggle span::before,
.lp-nav-toggle span::after {
	content: ""; display: block; width: 20px; height: 2px; margin: 0 auto; background: currentColor;
}
.lp-nav-toggle span::before { transform: translateY(-6px); }
.lp-nav-toggle span::after  { transform: translateY(4px); }

@media (max-width: 1099px) {
	.lp-header--nav { position: sticky; }
	.lp-header--nav .lp-header__actions { margin-left: auto; }
	.lp-nav-toggle { display: block; }
	.lp-nav {
		display: none; margin: 0;
		position: absolute; top: 100%; left: 0; right: 0;
		background: var(--lp-brand-dark);
		padding: 8px var(--lp-gut) 18px;
		box-shadow: 0 16px 30px rgba(0, 0, 0, .25);
	}
	.lp-nav.is-open { display: block; }
	.lp-nav__list { flex-direction: column; gap: 0; }
	.lp-nav__list > li { border-bottom: 1px solid rgba(255, 255, 255, .12); }
	.lp-nav a { display: block; padding: 14px 0; }
}

@media (max-width: 719px) {
	/* Phones: logo left, menu button right (the action bar carries the CTAs). */
	.lp-header--nav { position: relative; }
	.lp-header--nav .lp-header__inner { justify-content: space-between; }
}

/* Microsite pages ------------------------------------------------------- */

.lp-microsite .lp-about__text > * + * { margin-top: 1em; }
@media (min-width: 720px) {
	.lp-hero--ms { min-height: 770px; display: flex; align-items: center; }
	.lp-hero--ms .lp-hero__inner { width: 100%; }
}

@media (min-width: 860px) { .lp-steps__grid--3 { grid-template-columns: repeat(3, 1fr); } }

.lp-ms-prog { text-align: center; }
.lp-ms-prog__title { font-size: var(--lp-fs-h4); }
.lp-ms-prog p { font-size: var(--lp-fs-sm); line-height: 1.6; flex: 1 1 auto; }
.lp-ms-prog__link { font-weight: 700; color: var(--lp-brand); }
.lp-ms-prog__link::after { content: " \203A"; }

.lp-ms-contact__grid { display: grid; gap: var(--lp-grid-gap); }
@media (min-width: 860px) { .lp-ms-contact__grid { grid-template-columns: repeat(3, 1fr); } }
.lp-ms-card {
	background: #fff; border: 1px solid var(--lp-line); border-radius: var(--lp-radius);
	padding: var(--lp-card-pad); display: flex; flex-direction: column; gap: 14px; text-align: center;
}
.lp-ms-card p { font-size: var(--lp-fs-sm); line-height: 1.6; flex: 1 1 auto; }
.lp-ms-card .lp-prog__icon svg { width: 22px; height: 22px; fill: currentColor; }
.lp-btn--outline { background: transparent; border-color: var(--lp-brand); color: var(--lp-brand); }
.lp-btn--outline:hover { background: var(--lp-brand); color: #fff; }
.lp-ms-map { margin-top: var(--lp-grid-gap); border-radius: var(--lp-radius); overflow: hidden; border: 1px solid var(--lp-line); }
.lp-ms-map iframe { display: block; width: 100%; height: clamp(280px, 36vw, 420px); border: 0; }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
