/* =====================================================================
   CogentNext — USA Landing Page  |  style.css  (desktop / base)
   ---------------------------------------------------------------------
   ALL rules are scoped under .lp-usa (or the landing header/footer parity
   block clearly marked at the bottom). This file is isolated to the
   /microsoft-dynamics-365-consulting-usa/ landing page and must not affect any other
   CogentNext page. Responsive/mobile rules live in mobile.css.
   ===================================================================== */

/* Livvic — used by the "Solutions For U.S. Businesses" section heading (Figma spec) */
@import url("https://fonts.googleapis.com/css2?family=Livvic:wght@500;600;700&display=swap");

/* ------------------------------------------------------------------ *
 * 0. Tokens + scoped reset
 * ------------------------------------------------------------------ */
.lp-usa {
  --lp-red: #f34c45;
  --lp-red-dark: #d83b34;
  --lp-navy: #14356a;
  --lp-black: #000000;
  --lp-bg: #242424;
  --lp-panel: #1a1a1a;
  --lp-card: #262626;
  --lp-card-2: #111111;
  --lp-border: #3a3a3c;
  --lp-border-soft: #2f2f31;
  --lp-text: #ffffff;
  --lp-muted: #c3c3c5;
  --lp-muted-2: #9c9c9f;
  --lp-header-bg: #2b2b2b;
  --lp-radius: 14px;
  --lp-radius-lg: 24px;
  --lp-container: 1200px;
  --lp-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);

  font-family: "Poppins", "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  color: var(--lp-text);
  background: var(--lp-bg);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

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

.lp-usa img { max-width: 100%; height: auto; display: block; }

.lp-usa h1, .lp-usa h2, .lp-usa h3, .lp-usa h4 {
  margin: 0;
  font-family: inherit;
  font-weight: 600;
  line-height: 1.25;
  color: rgba(255, 255, 255, 1); /* neutralises theme h1..h6{color:#0a0a0a}; component rules below raise specificity to override */
}
.lp-usa p { margin: 0 0 16px; }
.lp-usa p:last-child { margin-bottom: 0; }
.lp-usa ul, .lp-usa ol { margin: 0; padding: 0; list-style: none; }
.lp-usa a { color: inherit; text-decoration: none; }
.lp-usa strong { font-weight: 600; color: #fff; }

/* Prevent horizontal scroll originating from this page.
   `clip` (not `hidden`) so it doesn't create a scroll container — keeps
   the sticky header working. */
.lp-usa-body { overflow-x: clip; }

/* ------------------------------------------------------------------ *
 * 1. Layout helpers
 * ------------------------------------------------------------------ */
.lp-container {
  width: 100%;
  max-width: var(--lp-container);
  margin: 0 auto;
  padding: 0 24px;
}
.lp-container--narrow { max-width: 960px; }

.lp-usa section { padding: 84px 0; }

/* Section backgrounds per Figma */
.lp-hero        { padding: 0; } /* no background colour — full-bleed banner image set in section 4 */
.lp-intro       { background: var(--lp-bg); }
.lp-services    { background: var(--lp-bg); }
.lp-process     { background: var(--lp-black); }
.lp-why         { background: var(--lp-black); }
.lp-industries  { background: var(--lp-bg); }
.lp-markets     { background: var(--lp-bg); }
.lp-faq         { background: var(--lp-bg); }

/* ------------------------------------------------------------------ *
 * 2. Shared headings + buttons
 * ------------------------------------------------------------------ */
.lp-usa .lp-heading {
  color: var(--lp-red);
  font-size: 34px;
  line-height: 23px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 48px;
  margin-top: -30px;
}
.lp-usa .lp-heading--left { text-align: left; }

.lp-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font: inherit;
  font-weight: 400;
  font-size: 15px;
  line-height: 1;
  border-radius: 8px;
  padding: 13px 22px;
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.lp-btn--solid {
  background: var(--lp-red);
  color: #fff;
  border: 1px solid var(--lp-red);
}
.lp-btn--solid:hover { background: var(--lp-red-dark); border-color: var(--lp-red-dark); }

.lp-btn--ghost {
  background: transparent;
  color: var(--lp-red);
  border: 1px solid var(--lp-red);
  padding: 11px 20px;
}
.lp-btn--ghost:hover { background: var(--lp-red); color: #fff; }
.lp-btn--ghost i { font-size: 10px; transition: transform .18s ease; }
.lp-btn--ghost:hover i { transform: translateX(3px); }

/* ------------------------------------------------------------------ *
 * 3. Landing header (landing-specific — NOT common/header.php)
 * ------------------------------------------------------------------ */
.lp-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--lp-header-bg);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.lp-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 76px;
  gap: 24px;
}
.lp-header__logo img { width: 170px; height: auto; }

.lp-nav__list {
  display: flex;
  align-items: center;
  gap: 34px;
}
.lp-nav__link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: none;
  border: 0;
  font: inherit;
  font-size: 16px;
  font-weight: 500;
  color: #fff;
  cursor: pointer;
  padding: 8px 0;
}
.lp-nav__link:hover { color: var(--lp-red); }
.lp-nav__subtoggle i { font-size: 11px; transition: transform .2s ease; }

.lp-nav__item--has-sub { position: relative; }
.lp-nav__sub {
  position: absolute;
  top: 100%;
  left: -16px;
  min-width: 232px;
  background: #1c1c1c;
  border: 1px solid var(--lp-border);
  border-radius: 10px;
  padding: 8px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
  box-shadow: var(--lp-shadow);
}
.lp-nav__item--has-sub:hover .lp-nav__sub {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.lp-nav__item--has-sub:hover .lp-nav__subtoggle i { transform: rotate(180deg); }
.lp-nav__sub a {
  display: block;
  padding: 10px 12px;
  font-size: 14.5px;
  color: var(--lp-muted);
  border-radius: 7px;
}
.lp-nav__sub a:hover { background: #262626; color: #fff; }

.lp-nav__item--cta .lp-btn { font-size: 14px; padding: 11px 18px; }

/* hamburger */
.lp-header__toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 10px;
}
.lp-header__toggle span {
  display: block;
  height: 2px;
  width: 100%;
  margin: 4px 0;
  background: #fff;
  border-radius: 2px;
  transition: transform .2s ease, opacity .2s ease;
}

/* ------------------------------------------------------------------ *
 * 4. Hero
 *    Banner image (images/usa-banner-cogentnext.jpeg) fills the whole
 *    hero, edge to edge — image only, no background colour, no overlay.
 *    The <h1> heading + intro copy (white) sit over the banner. Fluid +
 *    stacked on tablet/mobile (see mobile.css).
 * ------------------------------------------------------------------ */
.lp-usa .lp-hero {
  position: relative;
  overflow: hidden;
  padding: 0;                 /* beat .lp-usa section {padding:84px 0} */
}
.lp-hero__grid {
  /* not positioned, so the absolutely-positioned banner below fills the
     FULL .lp-hero width (edge to edge), while this container keeps the
     copy within the normal max-width */
  display: block;
  min-height: 475px;
  padding-top: 116px;
  padding-bottom: 44px;
}
.lp-hero__copy { position: relative; z-index: 2; max-width: 560px; }

/* --- Hero banner image : full-bleed, edge to edge. The JPEG has its own
   built-in dark panel on the left for the heading — image only, no
   overlay. (Source cropped to 1500x574 to remove a white strip that was
   baked into the bottom of the original export.) --- */
.lp-hero__media {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  z-index: 0;
  background-image: url("images/usa-banner-cogentnext.jpeg");
  background-repeat: no-repeat;
  background-position: center right;
  background-size: cover;
}
.lp-usa .lp-hero__title {
  color: rgba(255, 255, 255, 1);
  font-size: 44px;
  font-weight: 700;
  line-height: 1.22;
  margin-bottom: 22px;
}
.lp-hero__text {
  color: rgba(255, 255, 255, 1);
  font-size: 17px;
  max-width: 520px;
}
.lp-hero__text strong { color: rgba(255, 255, 255, 1); }

/* ------------------------------------------------------------------ *
 * 5. Intro — "Solutions For U.S. Businesses"   (Figma layout)
 *    Two columns:  image (145px offset + 351px)  |  44px gap  |  copy (<=490px)
 *    -> the copy left edge lands at 540px, matching the Figma.
 *    align-items:stretch makes the image match the copy's height, so the
 *    image bottom lines up with the callout bottom. Stacks on mobile
 *    (see mobile.css).
 * ------------------------------------------------------------------ */
.lp-intro__grid {
  display: grid;
  grid-template-columns: 496px minmax(0, 490px);   /* 145 + 351  |  copy */
  gap: 44px;
  align-items: stretch;
  padding: 36px 0 0;                                /* Figma top offset ~36px */
}
.lp-intro__media {
  padding-left: 145px;                             /* Figma: image left 145px */
  display: flex;
}
.lp-intro__media img {
  width: 351px;                                    /* Figma: width 351px */
  height: 100%;                                    /* fill the row -> bottom aligns with the callout */
  min-height: 234.03px;                            /* Figma: height 234.03px (floor) */
  object-fit: cover;
  border-radius: 12px;                             /* Figma: radius 12px */
  display: block;
}
.lp-usa .lp-intro__copy .lp-heading {
  font-family: "Livvic";
  font-size: 34px;
  line-height: 30px;
  letter-spacing: 0;
  text-transform: capitalize;
  margin-bottom: 14px;
}
.lp-intro__copy p { color:rgba(255, 255, 255, 1); font-size: 15px; line-height: 15px; }

.lp-callout {
  display: flex;
  gap: 18px;
  align-items: center;                             /* icon vertically centered */
  margin-top: 18px;
  width: 100%;                                     /* fills the copy column (<=490px) */
  min-height: 90px;                                /* Figma: height 90 */
  padding: 16px 22px;
  border: 0.5px solid rgba(87, 87, 87, 1);         /* Figma: 0.5px solid #575757 */
  border-radius: var(--lp-radius);
  background: #2e2e2e;                             /* solid dark charcoal bar */
  opacity: 1;
}
/* callout icon — fluent_target-arrow-20-regular.svg
   Figma "Vector": position: absolute; left: 10%; right: 10%; top: 9.99%;
   bottom: 10.01%; fill #FDFDFD (baked into the SVG). */
.lp-callout__icon {
  position: relative;
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  line-height: 0;
}
.lp-callout__icon img {
  position: absolute;
  left: 10%;
  right: 10%;
  top: 9.99%;
  bottom: 10.01%;
  width: 80%;
  height: 80%;
  display: block;
}
.lp-callout p { color: rgba(255, 255, 255, 1); font-size: 15px; line-height: 16px;font-weight: 500; margin: 0; }

/* ------------------------------------------------------------------ *
 * 6. Services grid
 * ------------------------------------------------------------------ */
.lp-services__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 34px;
}
.lp-card {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding: 32px 28px;
  background: var(--lp-card);
  border: 0.5px solid rgba(87, 87, 87, 1);   /* Figma: 0.5px solid #575757 */
  border-radius: var(--lp-radius);
  transition: border-color .18s ease;
}
.lp-card:hover { border-color: rgba(255, 255, 255, 0.28); }   /* subtle grey — no red, no lift */
/* icon in the left column, title + text in the right column */
.lp-card__head {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  flex: 1;                                     /* fill height so the button sits at the bottom */
}
.lp-card__icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--lp-border);
}
.lp-card__icon img { width: 30px; height: 30px; object-fit: contain; display: block; }
.lp-card__body { min-width: 0; }               /* right column */
.lp-card__title { font-size: 19px; margin-bottom: 10px; }
.lp-card__text { color: rgba(255, 255, 255, 1); font-size: 15px; }
.lp-card .lp-btn--ghost {
  align-self: center;                          /* View Details centered */
  color: #f34c45;
  border-color: rgba(87, 87, 87, 1);          /* no red stroke — subtle grey outline */
}
.lp-card .lp-btn--ghost i { color: var(--lp-red); }   /* keep the arrow red */
.lp-card .lp-btn--ghost:hover {
  background: transparent;
  color:#f34c45;
  border-color: rgba(255, 255, 255, 0.45);
}

/* ------------------------------------------------------------------ *
 * 7. Consulting process (snake flow: 01>02>03>04 then 05<06<07)
 * ------------------------------------------------------------------ */
.lp-process__flow {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 56px 40px;
}
.lp-step {
  position: relative;
  text-align: center;
  padding: 0 6px;
}
/* bottom row reads 07 <- 06 <- 05, with 05 directly under 04 (matches Figma) */
.lp-step:nth-child(5) { grid-column: 4; grid-row: 2; }
.lp-step:nth-child(6) { grid-column: 3; grid-row: 2; }
.lp-step:nth-child(7) { grid-column: 2; grid-row: 2; }
/* connector arrows — images/arrow.svg (white, right-pointing) */
.lp-step:not(:nth-child(4n))::after {
  content: "";
  position: absolute;
  top: 46px;
  right: -30px;
  width: 26px;
  height: 16px;
  background: url("images/arrow.svg") no-repeat center / contain;   /* arrow.svg is fill #fff (rgba(255,255,255,1)) */
}
/* row 2 (05 <- 06 <- 07): point left */
.lp-step:nth-child(n+5)::after {
  left: -30px;
  right: auto;
  transform: rotate(180deg);
}
.lp-step:nth-child(7)::after { display: none; }   /* no arrow past step 07 */
/* step 04 -> step 05 : downward arrow, sitting in the row gap below the
   whole 04 card (not over the "04" number) */
.lp-step--turn::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;            /* start at the very bottom of the 04 card ... */
  margin-top: 18px;     /* ... then drop into the row gap, clear of the text */
  width: 26px;
  height: 16px;
  margin-left: -13px;
  background: url("images/arrow.svg") no-repeat center / contain;
  transform: rotate(90deg);
}
.lp-step__badge {
  width: 108px;
  height: 108px;
  border-radius: 50%;
  border: 1px solid #3f3f3f;
  display: grid;
  place-items: center;
  margin: 0 auto 18px;
  color: #fff;
}
.lp-step__badge img { width: 38px; height: 38px; object-fit: contain; display: block; }
.lp-step__num { display: block; font-size: 22px; font-weight: 700; margin-bottom: 4px; }
.lp-step__title { font-size: 18px; margin-bottom: 10px; }
.lp-step__text { color: rgba(255, 255, 255, 1); font-size: 14.5px; }

/* ------------------------------------------------------------------ *
 * 8. Why choose CogentNext
 * ------------------------------------------------------------------ */
/* 6-col grid: row 1 = 3 items x 2 cols; row 2 = 2 items x 2 cols, offset
   half a column right (cols 2-3 and 4-5) — matches the Figma */
.lp-why__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  row-gap: 46px;
  column-gap: 0;
  max-width: 1000px;
  margin: 0 auto;
}
.lp-why__item {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 16px;
  align-items: start;
  padding: 0 34px;
}
.lp-why__item:nth-child(1) { grid-column: 1 / 3; }
.lp-why__item:nth-child(2) { grid-column: 3 / 5; }
.lp-why__item:nth-child(3) { grid-column: 5 / 7; }
.lp-why__item:nth-child(4) { grid-column: 2 / 4; }
.lp-why__item:nth-child(5) { grid-column: 4 / 6; }
/* vertical dividers between items in each row */
.lp-why__item:nth-child(1),
.lp-why__item:nth-child(2),
.lp-why__item:nth-child(4) { border-right: 1px solid var(--lp-border-soft); }
.lp-why__icon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #1c1c1c;
  border: 1px solid var(--lp-border-soft);
  display: grid;
  place-items: center;
  color: #fff;
}
.lp-why__icon img { width: 22px; height: 22px; object-fit: contain; display: block; }
.lp-why__title { font-size: 20px; margin-bottom: 10px; }
.lp-why__body p { color: rgba(255, 255, 255, 1); font-size: 15px; }

/* ------------------------------------------------------------------ *
 * 9. Industries We Serve
 * ------------------------------------------------------------------ */
.lp-industries__grid {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 48px;
  align-items: stretch;      /* image column height == content column height */
  max-width: 920px;          /* centered block, not edge-to-edge */
  margin-inline: auto;
}
.lp-industries__media {
  border-radius: 18px;
  overflow: hidden;
  background: #17335c;
  height: 100%;
}
.lp-industries__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* plain text rows — no card, no dividers, just icon + text */
.lp-industry {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 16px;
  align-items: center;
  padding: 13px 0;
}
.lp-industry:first-child { padding-top: 0; }
.lp-industry:last-child { padding-bottom: 0; }
.lp-industry__icon {
  position: relative;
  width: 56px;
  height: 57px;
  display: grid;
  place-items: center;
  color: #fff;
}
/* Figma "Rectangle 59" — gradient chip behind the icon (rectangle only at 50% opacity) */
.lp-industry__icon::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 4px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.06) 100%);
  opacity: 0.5;
}
.lp-industry__icon img {
  position: relative;
  z-index: 1;
  width: 34px;
  height: 34px;
  object-fit: contain;
  display: block;
}
.lp-industry__title { font-size: 19px; margin-bottom: 5px; }
.lp-industry__body p { color: rgba(255, 255, 255, 1); font-size: 15px; }

/* ------------------------------------------------------------------ *
 * 10. USA markets + Partner panels
 * ------------------------------------------------------------------ */
.lp-markets__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 32px;
  max-width: 1040px;              /* ~504px cards — matches the Figma proportion */
  margin-inline: auto;
}
.lp-panel {
  position: relative;
  overflow: hidden;
  background: rgba(17, 17, 17, 0.68);         /* Figma: Rectangle 59 fill */
  -webkit-backdrop-filter: blur(14px);        /* Figma: background blur — glass effect */
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;                        /* Figma: radius 16px */
  padding: 34px 34px;
}
.lp-panel .lp-heading { font-size: 22px; line-height: 1.3; margin-bottom: 14px; }
.lp-panel p { color: rgba(255, 255, 255, 1); font-size: 14px; line-height: 1.5; margin-bottom: 12px; }

/* US map watermark — real <img> (carries alt text for SEO), sat behind the card content */
.lp-panel__map {
  position: absolute;
  left: 50%;
  top: 62%;
  transform: translate(-50%, -50%);
  width: 82%;
  height: auto;
  z-index: 0;
  pointer-events: none;
  user-select: none;
}
.lp-panel--map > :not(.lp-panel__map) { position: relative; z-index: 1; }
.lp-states {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}
.lp-states__item {
  padding: 7px 13px;
  border: 1px solid var(--lp-border);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.02);
  font-size: 12.5px;
  color: rgba(255, 255, 255, 1);
}

.lp-partner__lead { color: #fff !important; font-weight: 600; margin-bottom: 10px; }
.lp-pillars {
  display: flex;
  flex-wrap: nowrap;                 /* keep all 5 on one line */
  align-items: flex-start;
  justify-content: space-between;     /* stretch evenly across the card width */
  gap: 4px;
  margin: 4px 0 12px;
}
.lp-pillars__item { display: flex; flex-direction: column; align-items: center; gap: 6px; width: 62px; flex-shrink: 0; }
.lp-pillars__icon {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #1c1c1c;
  border: 1px solid var(--lp-border-soft);
  display: grid;
  place-items: center;
  color: #fff;
}
.lp-pillars__icon img { width: 22px; height: 18px; object-fit: contain; display: block; }
.lp-pillars__label { font-size: 12.5px; font-weight: 600; }
.lp-pillars__plus { align-self: center; padding-top: 11px; color: var(--lp-muted-2); font-size: 15px; font-weight: 600; }

/* ------------------------------------------------------------------ *
 * 11. FAQ accordion
 * ------------------------------------------------------------------ */
.lp-accordion { display: flex; flex-direction: column; gap: 20px; }
.lp-accordion__item {
  background: var(--lp-card-2);
  border: 1px solid var(--lp-border-soft);
  border-radius: 12px;
  overflow: hidden;
}
.lp-accordion__q {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  text-align: left;
  background: none;
  border: 0;
  cursor: pointer;
  font: inherit;
  font-size: 17px;
  font-weight: 500;
  color: #fff;
  padding: 24px 30px;
}
.lp-accordion__mark {
  position: relative;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
}
.lp-accordion__mark::before,
.lp-accordion__mark::after {
  content: "";
  position: absolute;
  background: #fff;
  border-radius: 2px;
  transition: transform .2s ease, opacity .2s ease;
}
.lp-accordion__mark::before { top: 10px; left: 0; width: 22px; height: 2px; }
.lp-accordion__mark::after  { left: 10px; top: 0; width: 2px; height: 22px; }
/* open state: + becomes × */
.lp-accordion__q[aria-expanded="true"] .lp-accordion__mark::before,
.lp-accordion__item.is-open .lp-accordion__mark::before { transform: rotate(45deg); }
.lp-accordion__q[aria-expanded="true"] .lp-accordion__mark::after,
.lp-accordion__item.is-open .lp-accordion__mark::after  { transform: rotate(45deg); opacity: 1; }

/* no blue focus/hover ring (overrides bootstrap's button:focus outline) */
.lp-accordion__q:hover,
.lp-accordion__q:active { background: none; }
.lp-accordion__q:focus { outline: none; }
.lp-accordion__q:focus-visible {
  outline: 2px solid rgba(243, 76, 69, 0.55);
  outline-offset: -3px;
  border-radius: 12px;
}

/* open (dropdown) item — frosted glass + soft glow */
.lp-accordion__item.is-open {
  background: linear-gradient(180deg,
              rgba(255, 255, 255, 0.10) 0%,
              rgba(255, 255, 255, 0.028) 42%,
              rgba(255, 255, 255, 0.06) 100%);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  border-color: rgba(255, 255, 255, 0.16);
  box-shadow:
    0 24px 60px rgba(0, 0, 0, 0.5),
    0 0 44px rgba(255, 255, 255, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.lp-accordion__item.is-open .lp-accordion__q { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }

.lp-accordion__a {
  padding: 18px 30px 26px;
  color: var(--lp-muted);
  font-size: 15.5px;
}
.lp-accordion__a[hidden] { display: none; }

/* ===================================================================== *
 *  FOOTER PARITY  (shared include: common/footer.php)
 *  ---------------------------------------------------------------------
 *  common/footer.php is a bare markup partial that relies on per-page
 *  CSS for its dark treatment (the main site sets these same rules
 *  inline). Replicated here so the shared footer matches the rest of
 *  the site ON THIS PAGE ONLY. common/footer.php itself is NOT modified,
 *  and these selectors only load via this landing page's stylesheet.
 * ===================================================================== */
.lp-usa-body .rs-footer { background: #131313; background-size: cover; }
.lp-usa-body .rs-footer,
.lp-usa-body .rs-footer h3,
.lp-usa-body .rs-footer a,
.lp-usa-body .rs-footer .fa-ul li a,
.lp-usa-body .rs-footer .widget.widget_nav_menu ul li a { font-size: 16px; }
.lp-usa-body .rs-footer h3,
.lp-usa-body .rs-footer .footer-top h3.footer-title { font-size: 22px; }
.lp-usa-body .rs-footer,
.lp-usa-body .rs-footer .footer-top h3.footer-title,
.lp-usa-body .rs-footer a,
.lp-usa-body .rs-footer .fa-ul li a,
.lp-usa-body .rs-footer .widget.widget_nav_menu ul li a { color: #a9a9a9; }
.lp-usa-body .rs-footer a:hover,
.lp-usa-body .rs-footer .widget.widget_nav_menu ul li a:hover,
.lp-usa-body .rs-footer .fa-ul li a:hover { color: #f34c45; }
.lp-usa-body .footer-bottom .copyright p { color: #ffffff; }