@import url("./site-foundation.css");

/*
 * NYC Luxury Club portable service-page system.
 * Intended for Divi Code Modules now, WordPress enqueue next, and Next.js reuse later.
 * Scope every declaration to .nlc-service. Do not style WordPress, Divi, or theme globals.
 * Font loading (NLC-DEV-20260825-06, moved to site-foundation.css under
 * NLC-DEV-20260826-11): font loading no longer lives directly in this file.
 * The @import above pulls in shared/site-foundation.css, which centralizes
 * the exact live Homepage Google Fonts request (Playfair Display/Syne/DM
 * Sans) plus the value-identical base/accent/focus/text-on-accent/font-family
 * .nlc-service tokens, so .nlc-service pages no longer fall back to Georgia
 * (see docs/website/qa/homepage-us-open-font-face-forensics-2026-08-25.md).
 * This supersedes the temporary per-page US Open <link> added in
 * NLC-DEV-20260825-05, which has been removed from us-open/index.html.
 * Do not add a page-level Google Fonts <link> to any .nlc-service page;
 * site-foundation.css is the single source of truth for this font load.
 */

.nlc-service {
  --nlc-rule: rgba(255, 255, 255, 0.08);
  --nlc-rule-strong: rgba(7, 110, 198, 0.55);
  --nlc-content: min(1800px, calc(100vw - clamp(4rem, 6vw, 7rem)));
  --nlc-radius: 2px;
  background: var(--nlc-ink);
  color: var(--nlc-cream);
  font-family: var(--nlc-body);
  font-size: 16px;
  line-height: 1.6;
  overflow: clip;
  position: relative;
}

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

.nlc-service a {
  color: inherit;
}

/*
 * NLC-DEV-20260827-03: shared button-text specificity fix.
 * The blanket anchor reset above (specificity 0,1,1) was beating these
 * single-class accent-surface controls' own intended
 * `color: var(--nlc-on-accent-alt)` (specificity 0,1,0), so the
 * text silently fell back to inherited body/cream color instead of the
 * accessible on-accent value on every .nlc-service page except
 * corporate-car-service (which already carries its own page-local fix).
 * Confirmed live on town-car-service in NLC-DEV-20260827-01. This
 * `.nlc-service <selector>` compound (0,2,1) restores the intended value
 * without touching the anchor reset itself, which other plain links still
 * rely on. No !important needed: 0,2,1 already outranks the 0,1,1 reset.
 * Token value itself is confirmed unchanged (NLC-DEV-20260827-02): stays
 * var(--nlc-on-accent-alt) = #ffffff.
 */
.nlc-service .nlc-service__button--primary,
.nlc-service .nlc-service__floating-booker,
.nlc-service .nlc-service__band,
.nlc-service .nlc-service__fleet-tag {
  color: var(--nlc-on-accent-alt);
}

.nlc-service :where(a, button):focus-visible {
  outline: 3px solid var(--nlc-focus);
  outline-offset: 4px;
}

.nlc-service__shell {
  margin-inline: auto;
  max-width: var(--nlc-content);
  padding-inline: clamp(1.25rem, 4vw, 3rem);
  width: 100%;
}

.nlc-service__section {
  padding-block: clamp(4.5rem, 9vw, 8rem);
  position: relative;
}

.nlc-service__hero {
  --nlc-hero-padding-top: clamp(6rem, 11vw, 10rem);
  background:
    radial-gradient(circle at 82% 20%, rgba(7, 110, 198, 0.15), transparent 31rem),
    linear-gradient(135deg, var(--nlc-ink-deep) 0%, var(--nlc-ink) 62%, var(--nlc-surface) 100%);
  min-height: min(820px, 92vh);
  padding-top: var(--nlc-hero-padding-top);
}

/*
 * NLC-DEV-20260831-23: the former .nlc-service-nav-space > .nlc-service__
 * hero:first-of-type hero/nav-background-continuity rule (NLC-DEV-20260828
 * -14-C01) was removed here in favor of the adjacent-sibling nav-offset
 * model in shared/nav-harness.css (#nlcServiceNav + .nlc-service). That
 * removal did not change any hero content position (proven live in
 * NLC-DEV-20260831-22's preflight -- the rule's margin/padding pair
 * cancels algebraically regardless of its constant).
 *
 * NLC-DEV-20260831-25: with the old rule gone, the nav-offset padding
 * band on <main> (reserved by the same adjacent-sibling rule above) paints
 * .nlc-service's own flat background (var(--nlc-ink), no gradient)
 * instead of the hero section's atmospheric radial-gradient background,
 * producing a visible flat-vs-gradient seam right at the nav's bottom
 * edge. Re-introduced the same margin/padding-cancellation technique,
 * scoped precisely to hero sections that immediately follow the injected
 * nav (#nlcServiceNav + .nlc-service > .nlc-service__hero:first-of-type)
 * so it only applies where nav is actually present, using the current
 * accepted nav-offset constants (5.25rem / 4.75rem, matching
 * shared/nav-harness.css exactly, not the old stale 5.5rem). Content
 * position is provably unaffected (same cancellation math as before) --
 * only the hero background now bleeds up flush with the nav, closing the
 * seam. Does not touch --nlc-hero-padding-top, .nlc-service__display
 * font-size/line-height, or .nlc-service__hero-copy max-width.
 */
#nlcServiceNav + .nlc-service > .nlc-service__hero:first-of-type {
  margin-top: -5.25rem;
  padding-top: calc(var(--nlc-hero-padding-top) + 5.25rem);
}

@media (max-width: 1099px) {
  #nlcServiceNav + .nlc-service > .nlc-service__hero:first-of-type {
    margin-top: -4.75rem;
    padding-top: calc(var(--nlc-hero-padding-top) + 4.75rem);
  }
}

/*
 * NLC-DEV-20260831-21: shared desktop hero layout-measure refinement.
 * grid-template-columns ratio is intentionally UNCHANGED from the
 * accepted 1.15fr/0.85fr split -- testing found that split gives the
 * copy column exactly 628px at 1366px width (a common laptop size
 * already used to verify the locked NLC-DEV-20260831-14/-15/-16 hero
 * typography), and the display headline's line-wrap count is sensitive
 * enough at this font scale that narrowing the column even modestly
 * (down to ~620px) forces one extra wrapped line, undoing the
 * above-the-fold CTA gains from those prior tasks. Rebalancing the
 * fr ratio was tested and rejected for exactly this reason.
 *
 * The real "overly wide headline measure" problem is not at 1366px --
 * it's that the fr-based column has no ceiling, so it keeps growing
 * with the viewport indefinitely (measured 915px wide at 1920px, well
 * past a comfortable line length for this display type even at its
 * capped 104px font-size). .nlc-service__hero-copy's new max-width
 * caps this growth at wide desktop widths only; at 1366px and below,
 * the natural column (628px and narrower) is already under the cap, so
 * this is a complete no-op there -- zero change to line-wrap count or
 * CTA position at the width the locked typography was tuned against.
 * The cap also has a secondary, unplanned-but-welcome effect: once the
 * copy box stops growing, the extra space in its grid cell reads as
 * additional breathing room before the media column, making the image
 * feel more deliberately "balanced to the right" without moving the
 * media column itself or touching the grid ratio.
 *
 * This is the default shared .nlc-service behavior sitewide, not a
 * page-specific or opt-in modifier -- no new class, no page-name
 * selector. Locked typography (.nlc-service__display font-size/
 * line-height, .nlc-service__hero--editorial-split top padding) is
 * untouched; this rule only changes how much horizontal room the
 * existing type has to wrap within at wide viewports, not the type
 * itself, and not the room available at already-verified widths.
 */
.nlc-service__hero-grid {
  align-items: stretch;
  display: grid;
  gap: clamp(3rem, 7vw, 7rem);
  grid-template-columns: minmax(0, 1.15fr) minmax(20rem, 0.85fr);
}

.nlc-service__hero-copy {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
  justify-content: center;
  max-width: 40rem;
}

.nlc-service__kicker {
  align-items: center;
  color: var(--nlc-accent-bright);
  display: flex;
  font-family: var(--nlc-heading);
  font-size: 0.68rem;
  font-weight: 700;
  gap: 0.8rem;
  letter-spacing: 0.22em;
  line-height: 1.35;
  margin: 0;
  text-transform: uppercase;
}

.nlc-service__kicker::before {
  background: var(--nlc-accent);
  content: "";
  display: block;
  height: 1px;
  width: 2rem;
}

/*
 * NLC-DEV-20260831-14: shared desktop/laptop display scale refinement.
 * Ceiling lowered from 7.75rem/124px to 6.5rem/104px and the vw
 * coefficient lowered from 9vw to 7.5vw so the headline reaches a
 * moderately smaller size sooner on ordinary laptop/desktop widths
 * (>1024px, where this base rule governs -- the existing 901-1024px
 * tablet band and the existing <=640px mobile band each keep their own
 * separate, already-smaller clamp() below and are untouched), giving the
 * hero CTA row a better chance of landing above the fold without
 * shrinking the display into feeling ordinary. The floor (3.4rem) is
 * unchanged, so the smallest end of this rule's own range is identical
 * to before. This replaces the viewport-height-triggered fallback
 * approach from NLC-DEV-20260831-11/-12 (removed in full under
 * NLC-DEV-20260831-13) with a single default-scale adjustment instead --
 * no max-height/orientation guard, no page-specific selector.
 *
 * NLC-DEV-20260831-15: line-height tightened slightly (0.9 -> 0.87)
 * alongside the shared hero top-padding reduction below, so a wrapped
 * multi-line headline takes a little less vertical room without reading
 * as cramped. font-size is unchanged from -14 -- this task adjusts
 * spacing only, not scale.
 *
 * NLC-DEV-20260831-16: 0.87 proved too tight in owner review -- once the
 * headline wraps across several lines (as it does at the -14 scale in a
 * narrow hero-copy column), consecutive lines read as visually cramped/
 * colliding rather than merely compact. Raised to 0.95, confirmed live
 * (see execution report) to give clear breathing room between wrapped
 * lines while still reading as tight, large, editorial display type --
 * not loose or ordinary. font-size (clamp(3.4rem, 7.5vw, 6.5rem), -14)
 * and hero top padding (-15) are both unchanged; this is a line-height-
 * only correction.
 */
.nlc-service__display {
  color: var(--nlc-cream);
  font-family: var(--nlc-display);
  font-size: clamp(3.4rem, 7.5vw, 6.5rem);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 0.95;
  margin: 0;
  text-wrap: balance;
}

.nlc-service__display em,
.nlc-service__title em {
  color: var(--nlc-accent);
  font-weight: 400;
}

.nlc-service__title {
  color: var(--nlc-cream);
  font-family: var(--nlc-display);
  font-size: clamp(2.5rem, 5vw, 4.75rem);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  margin: 0;
  text-wrap: balance;
}

.nlc-service__copy {
  color: var(--nlc-cream-dim);
  font-size: clamp(1rem, 1.5vw, 1.16rem);
  line-height: 1.75;
  margin: 0;
  max-width: 43rem;
}

.nlc-service__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
}

.nlc-service__button {
  align-items: center;
  border: 1px solid transparent;
  border-radius: var(--nlc-radius);
  display: inline-flex;
  font-family: var(--nlc-heading);
  font-size: 0.72rem;
  font-weight: 700;
  justify-content: center;
  letter-spacing: 0.16em;
  line-height: 1;
  min-height: 3.35rem;
  padding: 0.9rem 1.4rem;
  text-decoration: none;
  text-transform: uppercase;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.nlc-service__button--primary {
  background: var(--nlc-accent);
  color: var(--nlc-on-accent-alt);
}

.nlc-service__button--primary:hover {
  background: var(--nlc-accent-deep);
}

.nlc-service__button--secondary {
  border-color: var(--nlc-rule-strong);
  color: var(--nlc-cream);
}

.nlc-service__button--secondary:hover {
  border-color: var(--nlc-accent-bright);
  color: var(--nlc-accent-bright);
}

/*
 * NLC-DEV-20260828-16: light-mode hover/focus color correction. The base
 * rule above only styles :hover (not :focus-visible), so a keyboard-
 * focused secondary button previously kept its base color: var(--nlc-cream)
 * -- which resolves to near-black ink (#1a1612) in light mode -- instead of
 * ever turning blue. This adds explicit :hover/:focus-visible coverage,
 * light-mode only, using var(--nlc-accent-deep) (the darker accent that
 * reads clearly against the light parchment canvas, per the already-
 * accepted footer_quote/footer_phone pattern below) rather than
 * var(--nlc-accent-bright), which STYLE.md calibrates for dark backgrounds.
 * Dark mode is intentionally unchanged: :hover still resolves to
 * var(--nlc-accent-bright) via the unscoped rule above, and :focus-visible
 * still falls back to the base var(--nlc-cream) (light cream on dark,
 * already readable), matching the stop condition against changing dark-mode
 * behavior.
 */
[data-theme="light"] .nlc-service__button--secondary:hover,
[data-theme="light"] .nlc-service__button--secondary:focus-visible {
  border-color: var(--nlc-accent-deep);
  color: var(--nlc-accent-deep);
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__button--secondary:hover,
[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__button--secondary:focus-visible {
  border-color: var(--nlc-accent-deep) !important;
  color: var(--nlc-accent-deep) !important;
}

.nlc-service__text-link {
  border-bottom: 1px solid var(--nlc-rule-strong);
  color: var(--nlc-cream);
  display: inline-flex;
  font-family: var(--nlc-heading);
  font-size: 0.72rem;
  font-weight: 700;
  gap: 0.75rem;
  letter-spacing: 0.14em;
  padding-bottom: 0.45rem;
  text-decoration: none;
  text-transform: uppercase;
}

.nlc-service__text-link:hover {
  border-color: var(--nlc-accent-bright);
  color: var(--nlc-accent-bright);
}

/* NLC-DEV-20260828-16: same light-mode hover/focus correction as the
 * secondary button above, applied to the generic text-link component. */
[data-theme="light"] .nlc-service__text-link:hover,
[data-theme="light"] .nlc-service__text-link:focus-visible {
  border-color: var(--nlc-accent-deep);
  color: var(--nlc-accent-deep);
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__text-link:hover,
[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__text-link:focus-visible {
  border-color: var(--nlc-accent-deep) !important;
  color: var(--nlc-accent-deep) !important;
}

.nlc-service__media {
  background:
    radial-gradient(circle at 78% 12%, rgba(105, 181, 245, 0.14), transparent 60%),
    linear-gradient(135deg, rgba(7, 110, 198, 0.16), transparent 55%),
    linear-gradient(150deg, #171512, #080706 90%);
  border: 1px solid var(--nlc-rule);
  min-height: 26rem;
  overflow: hidden;
  position: relative;
}

.nlc-service__media::before {
  border: 1px solid rgba(242, 235, 217, 0.12);
  content: "";
  inset: 12%;
  position: absolute;
}

.nlc-service__media-caption {
  bottom: 1rem;
  color: var(--nlc-cream-ghost);
  font-family: var(--nlc-heading);
  font-size: 0.62rem;
  left: 1.1rem;
  letter-spacing: 0.12em;
  position: absolute;
  text-transform: uppercase;
}

/*
 * Shared hero variants (NLC-DEV-20260820-01). Reusable across pages that
 * need a tighter editorial hero padding, a portrait-responsive media
 * treatment, or a longer H1 that needs more conservative sizing than the
 * default .nlc-service__display. Page CSS may still add page-specific crop
 * (object-position), watermark, or root-modifier rules on top of these.
 */
/*
 * NLC-DEV-20260831-15: shared hero-spacing refinement. Top padding lowered
 * modestly (clamp(4.5rem, 5vw, 5rem) -> clamp(3rem, 4vw, 4rem)) so pages
 * using this variant (UN General Assembly, Corporate Car Service, and any
 * other .nlc-service__hero--editorial-split consumer) sit slightly closer
 * to the top of the viewport, improving above-the-fold balance alongside
 * the NLC-DEV-20260831-14 desktop display-scale reduction. Still a modest
 * change, not a collapse: floor only drops 1.5rem/24px, ceiling only
 * drops 1rem/16px. No max-height/orientation guard, no page-specific
 * selector -- this rule already applies to every consuming page equally.
 */
.nlc-service__hero--editorial-split {
  --nlc-hero-padding-top: clamp(1.75rem, 2.5vw, 2.75rem);
  padding-top: var(--nlc-hero-padding-top);
}

/*
 * Opt-in decorative hero watermark (NLC-DEV-20260829-17), promoted from six
 * identical page-local copies (black-car, business-car, corporate-car,
 * executive-car, town-car, limo). Deliberately opt-in, not a default: only
 * pages that already render this watermark should carry the modifier.
 */
.nlc-service__hero--watermark-nyc::after {
  color: rgba(7, 110, 198, 0.055);
  content: "NYC";
  font-family: var(--nlc-display);
  font-size: clamp(11rem, 31vw, 31rem);
  font-weight: 700;
  line-height: 0.7;
  pointer-events: none;
  position: absolute;
  right: -0.06em;
  top: 0.23em;
  user-select: none;
  z-index: 0;
}

.nlc-service__hero--watermark-nyc > .nlc-service__shell {
  position: relative;
  z-index: 1;
}

.nlc-service__media--portrait-responsive {
  align-self: center;
  aspect-ratio: 7 / 8;
  background: var(--nlc-ink-deep);
  margin: 0;
  min-height: 0;
  width: 100%;
}

@media (max-width: 1680px) {
  .nlc-service__media--portrait-responsive {
    aspect-ratio: 6 / 7;
  }
}

@media (max-width: 1520px) {
  .nlc-service__media--portrait-responsive {
    aspect-ratio: 3 / 4;
  }
}

@media (max-width: 1360px) {
  .nlc-service__media--portrait-responsive {
    aspect-ratio: 2 / 3;
  }
}

@media (max-width: 1120px) {
  .nlc-service__media--portrait-responsive {
    aspect-ratio: 9 / 16;
  }
}

@media (max-width: 900px) {
  .nlc-service__media--portrait-responsive {
    aspect-ratio: 16 / 9;
  }
}

.nlc-service__media--portrait-responsive picture {
  display: block;
  height: 100%;
  width: 100%;
}

.nlc-service__media--portrait-responsive img {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

/*
 * Opt-in hero media crop modifier (NLC-DEV-20260831-10), promoted from UN
 * General Assembly's page-local desktop/tablet crop fix (NLC-DEV-20260830-19).
 * The default .nlc-service__media--portrait-responsive img rule sets
 * object-fit: cover with no object-position, so it crops to center center
 * (50% 50%). Some hero assets need more of the lower subject kept in frame
 * once the portrait crop narrows on desktop/tablet widths (min-width: 901px,
 * where the vertical asset is shown inside a shorter, wider container).
 * Semantic and reusable by name, not scoped to any page class -- any hero
 * media element may opt in by adding this class alongside
 * .nlc-service__media--portrait-responsive. Pages that do not add it are
 * completely unaffected and keep the existing center-center default. Mobile
 * (below 901px) is intentionally untouched.
 */
@media (min-width: 901px) {
  .nlc-service__media--crop-bottom img {
    object-position: center bottom;
  }
}

.nlc-service__display--long {
  font-size: clamp(3rem, 5.5vw, 5.6rem);
  line-height: 0.96;
}

@media (max-width: 640px) {
  .nlc-service__display--long {
    font-size: clamp(2.75rem, 14vw, 4rem);
  }
}

.nlc-service__band {
  background: var(--nlc-accent);
  color: var(--nlc-on-accent-alt);
}

.nlc-service__band-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.nlc-service__band-grid span {
  align-items: center;
  display: flex;
  font-family: var(--nlc-heading);
  font-size: 0.7rem;
  font-weight: 700;
  gap: 0.75rem;
  letter-spacing: 0.14em;
  min-height: 4.7rem;
  padding: 1rem clamp(0.5rem, 2vw, 1.75rem);
  text-transform: uppercase;
}

.nlc-service__band-grid span + span {
  border-left: 1px solid rgba(255, 255, 255, 0.24);
}

.nlc-service__band-grid strong {
  font-family: var(--nlc-display);
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: 0;
}

.nlc-service__split {
  display: grid;
  gap: clamp(3rem, 9vw, 9rem);
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
}

.nlc-service__cards {
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(3, 1fr);
  margin-top: clamp(3rem, 7vw, 6rem);
}

.nlc-service__card {
  background: var(--nlc-card);
  border-top: 1px solid var(--nlc-rule);
  min-height: 20rem;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
}

.nlc-service__card::after {
  background: linear-gradient(90deg, var(--nlc-accent), transparent);
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  top: -1px;
  width: 35%;
}

.nlc-service__card-number {
  color: var(--nlc-accent-bright);
  display: block;
  font-family: var(--nlc-heading);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  margin-bottom: 4rem;
}

.nlc-service__card h3 {
  color: var(--nlc-cream);
  font-family: var(--nlc-display);
  font-size: clamp(1.65rem, 2.5vw, 2.25rem);
  font-weight: 400;
  line-height: 1.05;
  margin: 0 0 1.15rem;
}

.nlc-service__card p {
  color: var(--nlc-cream-dim);
  margin: 0;
}

.nlc-service__process {
  background: var(--nlc-surface);
}

.nlc-service__steps {
  list-style: none;
  margin: 0;
  padding: 0;
}

.nlc-service__steps li {
  border-top: 1px solid var(--nlc-rule);
  display: grid;
  gap: 1.25rem;
  grid-template-columns: 2.25rem 1fr;
  padding-block: 1.75rem;
}

.nlc-service__steps li:last-child {
  border-bottom: 1px solid var(--nlc-rule);
}

.nlc-service__steps span {
  color: var(--nlc-accent-bright);
  font-family: var(--nlc-display);
  font-size: 1.5rem;
}

.nlc-service__steps h3 {
  color: var(--nlc-cream);
  font-family: var(--nlc-heading);
  font-size: 0.9rem;
  letter-spacing: 0.08em;
  margin: 0 0 0.5rem;
  text-transform: uppercase;
}

.nlc-service__steps p {
  color: var(--nlc-cream-dim);
  margin: 0;
}

.nlc-service__routes {
  background: var(--nlc-ink);
}

.nlc-service__route-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(3, 1fr);
  margin-top: clamp(2.5rem, 6vw, 4rem);
}

.nlc-service__route {
  background: var(--nlc-card);
  border: 1px solid var(--nlc-rule);
  color: var(--nlc-cream-dim);
  padding: clamp(1.5rem, 3vw, 2.2rem);
  text-decoration: none;
}

.nlc-service__route h3 {
  color: var(--nlc-cream);
  font-family: var(--nlc-display);
  font-size: 1.6rem;
  line-height: 1.1;
  margin: 0 0 0.8rem;
}

.nlc-service__route p {
  margin: 0;
}

.nlc-service__route:hover {
  border-color: var(--nlc-rule-strong);
}

.nlc-service__note {
  border-left: 2px solid var(--nlc-accent);
  color: var(--nlc-cream-dim);
  display: grid;
  gap: 0.35rem;
  margin-top: 2rem;
  padding-left: 1rem;
}

.nlc-service__note strong {
  color: var(--nlc-cream);
}

/*
 * Shared FAQ accordion (NLC-DEV-20260820-01). Promoted from
 * corporate-car-service/styles.css — generic, token-based, no
 * Corporate-specific values. Native <details>/<summary>, fully readable
 * with JavaScript disabled.
 */
.nlc-service__faq-list {
  display: grid;
  gap: 1px;
  margin-top: clamp(2.5rem, 6vw, 4rem);
}

.nlc-service__faq-item {
  background: var(--nlc-card);
  border-top: 1px solid var(--nlc-rule);
  padding: clamp(1.25rem, 2.5vw, 1.75rem) clamp(1.5rem, 3vw, 2.2rem);
}

.nlc-service__faq-item:last-child {
  border-bottom: 1px solid var(--nlc-rule);
}

.nlc-service__faq-question {
  color: var(--nlc-cream);
  cursor: pointer;
  font-family: var(--nlc-body);
  font-size: clamp(1rem, 1.3vw, 1.1rem);
  font-weight: 700;
  line-height: 1.4;
  list-style: none;
  padding-right: 2rem;
  position: relative;
}

.nlc-service__faq-question::-webkit-details-marker {
  display: none;
}

.nlc-service__faq-question::after {
  color: var(--nlc-accent-bright);
  content: "+";
  font-family: var(--nlc-heading);
  font-size: 1.2rem;
  position: absolute;
  right: 0;
  top: 0;
}

.nlc-service__faq-item[open] .nlc-service__faq-question::after {
  content: "\2212";
}

.nlc-service__faq-question:focus-visible {
  outline: 3px solid var(--nlc-focus);
  outline-offset: 4px;
}

.nlc-service__faq-answer {
  color: var(--nlc-cream-dim);
  margin: 0.9rem 0 0;
  max-width: 43rem;
}

/*
 * Shared fleet system (NLC-DEV-20260820-01). Promoted from
 * corporate-car-service/styles.css. Includes the tag-rail topology so
 * every consuming page can use a real or accessible-hidden placeholder
 * badge without inventing new markup shape.
 */
.nlc-service__fleet-head {
  margin-bottom: clamp(2.5rem, 6vw, 4rem);
  max-width: 43rem;
}

.nlc-service__fleet-head .nlc-service__copy {
  margin-top: 1.25rem;
}

.nlc-service__fleet-cards {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 899px) {
  .nlc-service__fleet-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 639px) {
  .nlc-service__fleet-cards {
    grid-template-columns: 1fr;
  }
}

.nlc-service__fleet-card {
  background: var(--nlc-card);
  border: 1px solid var(--nlc-rule);
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 3vw, 2.5rem);
}

.nlc-service__fleet-tag-rail {
  margin-bottom: 1rem;
}

.nlc-service__fleet-tag {
  background: var(--nlc-accent);
  color: var(--nlc-on-accent-alt);
  display: inline-block;
  font-family: var(--nlc-heading);
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  margin: 0;
  padding: 0.25rem 0.75rem;
  text-transform: uppercase;
}

.nlc-service__fleet-tag--placeholder {
  visibility: hidden;
}

.nlc-service__fleet-visual {
  align-items: center;
  aspect-ratio: 4 / 3;
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  margin-bottom: 1.5rem;
  overflow: hidden;
}

.nlc-service__fleet-visual img {
  display: block;
  height: 100%;
  object-fit: contain;
  width: 100%;
}

/*
 * Opt-in specialty fleet-visual crop (NLC-DEV-20260829-23), promoted from
 * identical Motorcoach/Party Bus page-local copies. Sets only the two true
 * differences from the base treatment above (dark image well, cover crop
 * instead of contain); align-items/justify-content are inherited unchanged
 * since the image fills its container exactly at object-fit: cover.
 */
.nlc-service__fleet-visual--cover {
  background: var(--nlc-ink-deep);
}

.nlc-service__fleet-visual--cover img {
  object-fit: cover;
}

.nlc-service__fleet-body {
  display: flex;
  flex-direction: column;
  margin-top: auto;
}

.nlc-service__fleet-name {
  color: var(--nlc-cream);
  font-family: var(--nlc-display);
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0 0 0.5rem;
}

.nlc-service__fleet-role {
  color: var(--nlc-cream-dim);
  font-size: 0.95rem;
  line-height: 1.55;
  margin: 0;
  min-height: calc(3 * 1.55em);
}

.nlc-service__fleet-actions {
  margin-top: clamp(2rem, 5vw, 3rem);
}

/*
 * Shared image-bearing related-service route card (NLC-DEV-20260820-01).
 * `.nlc-service__route-card` is canonical for image-bearing cards.
 * The older unsuffixed `.nlc-service__route` rules above are retained for
 * backwards compatibility and are not modified by this promotion.
 */
.nlc-service__route-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(3, 1fr);
  margin-top: clamp(2.5rem, 6vw, 4rem);
}

@media (max-width: 899px) {
  .nlc-service__route-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 639px) {
  .nlc-service__route-grid {
    grid-template-columns: 1fr;
  }
}

.nlc-service__route-card {
  background: var(--nlc-card);
  border: 1px solid var(--nlc-rule);
  color: var(--nlc-cream-dim);
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 3vw, 2.2rem);
  text-decoration: none;
}

.nlc-service__route-card:hover {
  border-color: var(--nlc-rule-strong);
}

.nlc-service__route-visual {
  align-items: center;
  aspect-ratio: 4 / 3;
  background: var(--nlc-ink-deep);
  border: 1px dashed var(--nlc-rule);
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: 0.35rem;
  justify-content: center;
  margin-bottom: 1.5rem;
  overflow: hidden;
  text-align: center;
}

.nlc-service__route-visual--image {
  border-style: solid;
  margin: 0 0 1.5rem;
  overflow: hidden;
  padding: 0;
}

.nlc-service__route-visual--image img {
  display: block;
  height: 100%;
  object-fit: cover;
  object-position: center;
  width: 100%;
}

.nlc-service__route-body {
  display: flex;
  flex-direction: column;
  margin-top: auto;
}

.nlc-service__route-card h3 {
  color: var(--nlc-cream);
  font-family: var(--nlc-display);
  font-size: 1.6rem;
  line-height: 1.1;
  margin: 0 0 0.8rem;
}

.nlc-service__route-card p {
  color: var(--nlc-cream-dim);
  line-height: 1.55;
  margin: 0;
  min-height: calc(3 * 1.55em);
}

.nlc-service__routes-actions {
  margin-top: clamp(2rem, 5vw, 3rem);
}

/*
 * Shared "Quick Planning Answers" image-card planning-answer component
 * (NLC-DEV-20260830-15). Promoted from page-local `.nlc-faq-preview` CSS,
 * confirmed byte-identical between US Open and UN General Assembly by the
 * NLC-DEV-20260830-13 preflight before this promotion. Do not add a
 * page-specific modifier here -- both consuming pages use these exact
 * unscoped selectors already, and any future page-specific variant should
 * be a page-local exception layered on top, not a change to this block.
 */
.nlc-faq-preview {
  background-color: var(--nlc-ink-deep);
}

.nlc-faq-preview__grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(3, 1fr);
  margin-top: clamp(2.5rem, 6vw, 4rem);
}

@media (max-width: 899px) {
  .nlc-faq-preview__grid {
    grid-template-columns: 1fr;
  }
}

.nlc-faq-preview__card {
  background: var(--nlc-card);
  border: 1px solid var(--nlc-rule);
  display: block;
  overflow: hidden;
  position: relative;
}

.nlc-faq-preview__card img {
  aspect-ratio: 7 / 8;
  display: block;
  height: auto;
  object-fit: cover;
  object-position: center;
  width: 100%;
}

.nlc-faq-preview__panel {
  background: linear-gradient(to top, rgba(10, 10, 10, 0.88), rgba(10, 10, 10, 0.62) 70%, transparent);
  bottom: 0;
  left: 0;
  padding: clamp(1.5rem, 3vw, 2.2rem);
  position: absolute;
  right: 0;
}

.nlc-faq-preview__panel .nlc-service__kicker {
  min-height: calc(2 * 1.55em);
}

.nlc-faq-preview__panel h3 {
  color: var(--nlc-cream);
  font-family: var(--nlc-display);
  font-size: clamp(1.2rem, 2vw, 1.4rem);
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 0.65rem;
  min-height: calc(2 * 1.3em);
}

.nlc-faq-preview__panel p {
  color: var(--nlc-cream-dim);
  font-size: 0.95rem;
  line-height: 1.55;
  margin: 0;
}

[data-theme="light"] .nlc-faq-preview__panel h3 {
  color: var(--nlc-on-accent-alt);
}

[data-theme="light"] .nlc-faq-preview__panel p {
  color: var(--nlc-on-accent-alt);
  opacity: 0.8;
}

/*
 * NLC-DEV-20260827-05: closing CTA color/surface treatment, promoted from
 * the accepted US Open `--event-dark` pattern (docs/website/qa/
 * shared-closing-cta-pattern-preflight-2026-08-27.md). Coordinated change:
 * background AND text/button colors moved together (background alone would
 * leave near-black text on a near-black panel). Spacing/padding
 * deliberately left unchanged in this lane.
 */
.nlc-service__closing {
  background: var(--nlc-surface);
  color: var(--nlc-cream);
  padding-block: clamp(2.5rem, 6vw, 4.5rem);
}

.nlc-service__closing .nlc-service__title {
  color: var(--nlc-cream);
}

.nlc-service__closing-grid {
  align-items: center;
  display: grid;
  gap: 2rem;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.8fr);
}

.nlc-service__closing p {
  margin: 0 0 1.25rem;
}

.nlc-service__closing .nlc-service__button--secondary {
  border-color: var(--nlc-rule-strong);
  color: var(--nlc-cream);
}

.nlc-service__closing .nlc-service__button--secondary:hover {
  background: transparent;
  border-color: var(--nlc-accent-bright);
  color: var(--nlc-accent-bright);
}

/* NLC-DEV-20260828-16: same light-mode hover/focus correction as the base
 * secondary button, for the generic closing-section fallback (any closing
 * secondary button without a more specific data-cta-placement rule below). */
[data-theme="light"] .nlc-service__closing .nlc-service__button--secondary:hover,
[data-theme="light"] .nlc-service__closing .nlc-service__button--secondary:focus-visible {
  background: transparent;
  border-color: var(--nlc-accent-deep);
  color: var(--nlc-accent-deep);
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button--secondary:hover,
[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button--secondary:focus-visible {
  background: transparent !important;
  border-color: var(--nlc-accent-deep) !important;
  color: var(--nlc-accent-deep) !important;
}

/*
 * NLC-DEV-20260827-06: the closing "Book Online" action must stay visually
 * primary (solid accent blue) even though it uses the .nlc-service__button
 * --secondary class for outline-button base styling. Scoped to the
 * footer_booking attribute only, both modes, so it wins over the quiet
 * .nlc-service__button--secondary treatment above without touching
 * Request a Quote (footer_quote) or the phone link (footer_phone).
 */
.nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_booking"] {
  background: var(--nlc-accent);
  border-color: var(--nlc-accent);
  color: var(--nlc-on-accent-alt);
}

.nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_booking"]:hover,
.nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_booking"]:focus-visible {
  background: var(--nlc-accent-deep);
  border-color: var(--nlc-accent-deep);
  color: var(--nlc-on-accent-alt);
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_booking"] {
  background: var(--nlc-accent) !important;
  border-color: var(--nlc-accent) !important;
  color: var(--nlc-on-accent-alt) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_booking"]:hover,
#et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_booking"]:focus-visible {
  background: var(--nlc-accent-deep) !important;
  border-color: var(--nlc-accent-deep) !important;
  color: var(--nlc-on-accent-alt) !important;
}

/*
 * NLC-DEV-20260827-05: shared light-mode closing CTA, promoted from the
 * accepted Corporate Car warm-neutral candidate (NLC-DEV-20260826-17-C02/
 * C03/C04), dropping the .nlc-service--corporate-car page scope only.
 * Values unchanged from the accepted page-local versions. The base rule
 * above already resolves --nlc-cream to a dark ink in light mode via the
 * existing [data-theme="light"] .nlc-service token block, so title/
 * secondary-button text needs no separate light-mode override here; only
 * the panel background and the footer_booking/footer_quote/footer_phone
 * action-specific treatments need restating.
 */
[data-theme="light"] .nlc-service__closing {
  background: var(--nlc-card);
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__closing {
  background: var(--nlc-card) !important;
}

[data-theme="light"] .nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_booking"] {
  background: var(--nlc-accent);
  border-color: var(--nlc-accent);
  color: var(--nlc-on-accent-alt);
}

[data-theme="light"] .nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_booking"]:hover {
  background: var(--nlc-accent-deep);
  border-color: var(--nlc-accent-deep);
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_booking"] {
  background: var(--nlc-accent) !important;
  border-color: var(--nlc-accent) !important;
  color: var(--nlc-on-accent-alt) !important;
}

[data-theme="light"] .nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_quote"]:hover,
[data-theme="light"] .nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_quote"]:focus-visible {
  background: var(--nlc-ink);
  border-color: var(--nlc-rule-strong);
  color: var(--nlc-on-accent);
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_quote"]:hover,
[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button--secondary[data-cta-placement="footer_quote"]:focus-visible {
  background: var(--nlc-ink) !important;
  border-color: var(--nlc-rule-strong) !important;
  color: var(--nlc-on-accent) !important;
}

[data-theme="light"] .nlc-service__closing .nlc-service__text-link[data-cta-placement="footer_phone"]:hover,
[data-theme="light"] .nlc-service__closing .nlc-service__text-link[data-cta-placement="footer_phone"]:focus-visible {
  border-color: var(--nlc-accent-deep);
  color: var(--nlc-accent-deep);
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__text-link[data-cta-placement="footer_phone"]:hover,
[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__text-link[data-cta-placement="footer_phone"]:focus-visible {
  border-color: var(--nlc-accent-deep) !important;
  color: var(--nlc-accent-deep) !important;
}

/*
 * NLC-DEV-20260830-25: shared ghost/quiet closing-booking-button variant.
 * Add .nlc-service__button--ghost alongside .nlc-service__button--secondary
 * on a closing "Book Online" action to opt that one button out of the
 * book-first solid-accent default declared above (NLC-DEV-20260827-06) and
 * back to the quiet outline treatment, for quote-first pages where
 * "Request a Quote" is the sole primary closing action. This is class-based
 * opt-in only: pages that do not add this class are completely unaffected
 * and keep the existing solid default. Promoted from identical page-local
 * overrides previously duplicated in un-general-assembly/styles.css and
 * us-open/styles.css (confirmed byte-identical before promotion).
 *
 * Selector uses the full .nlc-service__button.nlc-service__button--secondary
 * .nlc-service__button--ghost chain (4 total class selectors) so its
 * specificity reaches the same level as the light-mode solid override two
 * blocks above (also 4 class/attribute selectors), which this rule must be
 * able to beat at rest, not just on hover. Source order (this block comes
 * after the solid override) settles any exact specificity tie.
 */
.nlc-service__closing .nlc-service__button.nlc-service__button--secondary.nlc-service__button--ghost {
  background: transparent;
  border-color: var(--nlc-rule-strong);
  color: var(--nlc-cream);
}

.nlc-service__closing .nlc-service__button.nlc-service__button--secondary.nlc-service__button--ghost:hover,
.nlc-service__closing .nlc-service__button.nlc-service__button--secondary.nlc-service__button--ghost:focus-visible {
  background: transparent;
  border-color: var(--nlc-accent-bright);
  color: var(--nlc-accent-bright);
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button.nlc-service__button--secondary.nlc-service__button--ghost {
  background: transparent !important;
  border-color: var(--nlc-rule-strong) !important;
  color: var(--nlc-cream) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button.nlc-service__button--secondary.nlc-service__button--ghost:hover,
#et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button.nlc-service__button--secondary.nlc-service__button--ghost:focus-visible {
  background: transparent !important;
  border-color: var(--nlc-accent-bright) !important;
  color: var(--nlc-accent-bright) !important;
}

[data-theme="light"] .nlc-service__closing .nlc-service__button.nlc-service__button--secondary.nlc-service__button--ghost:hover,
[data-theme="light"] .nlc-service__closing .nlc-service__button.nlc-service__button--secondary.nlc-service__button--ghost:focus-visible {
  background: transparent;
  border-color: var(--nlc-accent-deep);
  color: var(--nlc-accent-deep);
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button.nlc-service__button--secondary.nlc-service__button--ghost:hover,
[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button.nlc-service__button--secondary.nlc-service__button--ghost:focus-visible {
  background: transparent !important;
  border-color: var(--nlc-accent-deep) !important;
  color: var(--nlc-accent-deep) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__button,
#et-boc .et-l .nlc-service.nlc-service .nlc-service__text-link {
  text-decoration: none !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__button {
  display: inline-flex !important;
  line-height: 1 !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__display em,
#et-boc .et-l .nlc-service.nlc-service .nlc-service__title em {
  color: var(--nlc-accent) !important;
  font-weight: 400 !important;
}

/*
 * WordPress/Divi cascade hardening for the promoted shared components
 * (NLC-DEV-20260820-01). Generalized from the corporate-car-service-scoped
 * hardening rules to the unscoped .nlc-service.nlc-service root, since
 * FAQ/fleet/route-card are now shared, component-wide declarations, not
 * page-specific ones. Corporate-only crop/watermark hardening stays local
 * to corporate-car-service/styles.css.
 */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__fleet-name {
  color: var(--nlc-cream) !important;
  font-weight: 700 !important;
  line-height: 1.6 !important;
  margin: 0 0 0.5rem !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__fleet-role {
  color: var(--nlc-cream-dim) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__fleet-tag {
  color: var(--nlc-on-accent-alt) !important;
  background-color: var(--nlc-accent) !important;
  padding: 0.25rem 0.75rem !important;
  letter-spacing: 0.14em !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__fleet-tag-rail {
  margin-bottom: 1rem !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__fleet-visual {
  margin-bottom: 1.5rem !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__fleet-card {
  display: flex !important;
  flex-direction: column !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__fleet-body {
  display: flex !important;
  flex-direction: column !important;
  margin-top: auto !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__fleet-head {
  margin-bottom: clamp(2.5rem, 6vw, 4rem) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__fleet-actions {
  margin-top: clamp(2rem, 5vw, 3rem) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__route-card {
  background: var(--nlc-card) !important;
  border: 1px solid var(--nlc-rule) !important;
  color: var(--nlc-cream-dim) !important;
  display: flex !important;
  flex-direction: column !important;
  padding: clamp(1.5rem, 3vw, 2.2rem) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__route-card h3 {
  color: var(--nlc-cream) !important;
  font-family: var(--nlc-display) !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  margin: 0 0 0.8rem !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__route-card p {
  color: var(--nlc-cream-dim) !important;
  font-weight: 400 !important;
  margin: 0 !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__route-grid {
  margin-top: clamp(2.5rem, 6vw, 4rem) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__routes-actions {
  margin-top: clamp(2rem, 5vw, 3rem) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__faq-answer {
  color: var(--nlc-cream-dim) !important;
  margin-top: 0.9rem !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__faq-list {
  margin-top: clamp(2.5rem, 6vw, 4rem) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__media picture,
#et-boc .et-l .nlc-service.nlc-service .nlc-service__media img {
  display: block !important;
  height: 100% !important;
  width: 100% !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__media img {
  object-fit: cover !important;
}

/*
 * WordPress/Divi cascade hardening for the shared "Quick Planning Answers"
 * component (NLC-DEV-20260830-15), added at promotion time so the
 * component is safe on any future page pasted into an actual Divi Code
 * Module (neither current consuming page renders under #et-boc .et-l
 * today, per NLC-DEV-20260830-04's live inspection, but this mirror
 * protects against the same silent-cascade-reset failure every other
 * shared component here already guards against).
 */
#et-boc .et-l .nlc-service.nlc-service .nlc-faq-preview {
  background-color: var(--nlc-ink-deep) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-faq-preview__grid {
  display: grid !important;
  gap: 1.5rem !important;
  grid-template-columns: repeat(3, 1fr) !important;
  margin-top: clamp(2.5rem, 6vw, 4rem) !important;
}

@media (max-width: 899px) {
  #et-boc .et-l .nlc-service.nlc-service .nlc-faq-preview__grid {
    grid-template-columns: 1fr !important;
  }
}

#et-boc .et-l .nlc-service.nlc-service .nlc-faq-preview__card {
  background: var(--nlc-card) !important;
  border: 1px solid var(--nlc-rule) !important;
  display: block !important;
  overflow: hidden !important;
  position: relative !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-faq-preview__card img {
  aspect-ratio: 7 / 8 !important;
  display: block !important;
  height: auto !important;
  object-fit: cover !important;
  object-position: center !important;
  width: 100% !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-faq-preview__panel {
  background: linear-gradient(to top, rgba(10, 10, 10, 0.88), rgba(10, 10, 10, 0.62) 70%, transparent) !important;
  bottom: 0 !important;
  left: 0 !important;
  padding: clamp(1.5rem, 3vw, 2.2rem) !important;
  position: absolute !important;
  right: 0 !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-faq-preview__panel .nlc-service__kicker {
  min-height: calc(2 * 1.55em) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-faq-preview__panel h3 {
  color: var(--nlc-cream) !important;
  font-family: var(--nlc-display) !important;
  font-size: clamp(1.2rem, 2vw, 1.4rem) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  margin: 0 0 0.65rem !important;
  min-height: calc(2 * 1.3em) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-faq-preview__panel p {
  color: var(--nlc-cream-dim) !important;
  font-size: 0.95rem !important;
  line-height: 1.55 !important;
  margin: 0 !important;
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-faq-preview__panel h3 {
  color: var(--nlc-on-accent-alt) !important;
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-faq-preview__panel p {
  color: var(--nlc-on-accent-alt) !important;
  opacity: 0.8 !important;
}

/*
 * WordPress/Divi cascade hardening, moved verbatim from
 * corporate-car-service/styles.css (NLC-DEV-20260820-01). These were
 * already unscoped (no `.nlc-service--corporate-car` modifier, no page-ID
 * guard), so they are genuinely shared and now apply to every consuming
 * page, not just Corporate. Corporate-only crop/watermark hardening
 * remains local to corporate-car-service/styles.css.
 */

/* 1. Shell gutters (desktop) */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__shell {
  margin-inline: auto !important;
  padding-inline: clamp(1.25rem, 4vw, 3rem) !important;
  width: 100% !important;
}

/* 2. Hero display heading (H1) weight */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__display {
  font-family: var(--nlc-display) !important;
  font-weight: 700 !important;
  line-height: 0.95 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 3. Section title heading (H2) weight */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__title {
  font-family: var(--nlc-display) !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 4. Button base, primary, secondary variants */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__button {
  align-items: center !important;
  border: 1px solid transparent !important;
  border-radius: var(--nlc-radius) !important;
  display: inline-flex !important;
  font-family: var(--nlc-heading) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  justify-content: center !important;
  letter-spacing: 0.16em !important;
  line-height: 1 !important;
  min-height: 3.35rem !important;
  padding: 0.9rem 1.4rem !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__button--primary {
  background: var(--nlc-accent) !important;
  color: var(--nlc-cream) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__button--secondary {
  background: transparent !important;
  border-color: var(--nlc-rule-strong) !important;
  color: var(--nlc-cream) !important;
}

/* 5. Kicker color and tracking */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__kicker {
  color: var(--nlc-accent-bright) !important;
  letter-spacing: 0.22em !important;
  padding: 0 !important;
}

/* 6. Numbered-step card-number color, tracking, spacing */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__card-number {
  color: var(--nlc-accent-bright) !important;
  letter-spacing: 0.2em !important;
  margin-bottom: 4rem !important;
}

@media (max-width: 900px) {
  #et-boc .et-l .nlc-service.nlc-service .nlc-service__card-number {
    margin-bottom: 3rem !important;
  }
}

/* 7. Dim/secondary text colors */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__copy {
  color: var(--nlc-cream-dim) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__note {
  color: var(--nlc-cream-dim) !important;
  padding: 0 0 0 1rem !important;
  margin-top: 2rem !important;
  border-left: 2px solid var(--nlc-accent) !important;
  display: grid !important;
  gap: 0.35rem !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__note strong {
  color: var(--nlc-cream) !important;
}

/* 8. Service-fit band */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__band {
  background-color: var(--nlc-accent) !important;
  color: var(--nlc-on-accent-alt) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__band-grid span {
  color: var(--nlc-on-accent-alt) !important;
  padding: 1rem clamp(0.5rem, 2vw, 1.75rem) !important;
  letter-spacing: 0.14em !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__band-grid span + span {
  border-left: 1px solid rgba(255, 255, 255, 0.24) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__band-grid strong {
  color: var(--nlc-on-accent-alt) !important;
}

@media (max-width: 640px) {
  #et-boc .et-l .nlc-service.nlc-service .nlc-service__band-grid span + span {
    border-left: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.24) !important;
  }
}

/* 9. Text link weight, color, tracking, padding, underline rule */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__text-link {
  font-weight: 700 !important;
  color: var(--nlc-cream) !important;
  line-height: 1.6 !important;
  letter-spacing: 0.14em !important;
  padding-bottom: 0.45rem !important;
  text-transform: uppercase !important;
  border-bottom: 1px solid var(--nlc-rule-strong) !important;
}

/* 10. Service-explanation cards grid spacing */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__cards {
  margin-top: clamp(3rem, 7vw, 6rem) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__card h3 {
  color: var(--nlc-cream) !important;
  font-family: var(--nlc-display) !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  margin: 0 0 1.15rem !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__card p {
  color: var(--nlc-cream-dim) !important;
}

/* 11. Process steps: row rhythm, number color, heading, body copy */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__steps li {
  border-top: 1px solid var(--nlc-rule) !important;
  padding-block: 1.75rem !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__steps li:last-child {
  border-bottom: 1px solid var(--nlc-rule) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__steps span {
  color: var(--nlc-accent-bright) !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__steps h3 {
  color: var(--nlc-cream) !important;
  font-family: var(--nlc-heading) !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  margin: 0 0 0.5rem !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__steps p {
  color: var(--nlc-cream-dim) !important;
}

/*
 * Light-mode label color normalization (NLC-DEV-20260830-02). --nlc-accent-
 * bright has no light-mode-darker variant in site-foundation.css, so small
 * kicker/card-number/step-number labels read low-contrast against the light
 * parchment surfaces. Promoted from Corporate Car's accepted page-local fix
 * (NLC-DEV-20260826-17/-C02) to shared CSS, sitewide. Dark mode is
 * untouched: only new [data-theme="light"] rules are added below, no
 * existing rule is modified. #et-boc mirrors are included because 8 of 9
 * pages carry their own unscoped (dark-mode-only) page-local #et-boc
 * duplicates of these selectors; the added [data-theme="light"] attribute
 * selector gives the mirror strictly higher specificity, so it wins in
 * light mode regardless of source order.
 */
[data-theme="light"] .nlc-service__kicker {
  color: var(--nlc-accent-deep);
}

[data-theme="light"] .nlc-service__kicker::before {
  background: var(--nlc-accent-deep);
}

[data-theme="light"] .nlc-service__card-number {
  color: var(--nlc-accent-deep);
}

[data-theme="light"] .nlc-service__steps span {
  color: var(--nlc-accent-deep);
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__kicker {
  color: var(--nlc-accent-deep) !important;
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__kicker::before {
  background: var(--nlc-accent-deep) !important;
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__card-number {
  color: var(--nlc-accent-deep) !important;
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__steps span {
  color: var(--nlc-accent-deep) !important;
}

/* 15. Closing CTA support paragraph spacing */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__closing p {
  margin: 0 0 1.25rem !important;
}

/* 16. Mobile shell/button/band overrides at the existing 640px phone breakpoint */
@media (max-width: 640px) {
  #et-boc .et-l .nlc-service.nlc-service .nlc-service__shell {
    padding-inline: 1.15rem !important;
  }

  #et-boc .et-l .nlc-service.nlc-service .nlc-service__button {
    width: 100% !important;
  }
}

/* 22. Process steps list reset */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__steps {
  margin: 0 !important;
}

/* 24. Closing-band secondary button contrast (NLC-DEV-20260827-05: values
   updated to match the coordinated dark-panel promotion above) */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__closing .nlc-service__button--secondary {
  border-color: var(--nlc-rule-strong) !important;
  color: var(--nlc-cream) !important;
}

@media (max-width: 1024px) and (min-width: 901px) {
  .nlc-service__hero-grid {
    grid-template-columns: minmax(0, 1.3fr) minmax(18rem, 0.7fr);
  }

  .nlc-service__display {
    font-size: clamp(3.2rem, 7.2vw, 6.4rem);
  }
}

@media (max-width: 900px) {
  .nlc-service__hero {
    min-height: auto;
  }

  .nlc-service__hero-grid,
  .nlc-service__split,
  .nlc-service__closing-grid {
    grid-template-columns: 1fr;
  }

  /*
   * Hero text-overflow guardrail (NLC-DEV-20260829-15), promoted from
   * Party Bus's proven page-local fix (NLC-DEV-20260813-05-C02): removes
   * the implicit CSS Grid/flex min-content floor on the hero copy column
   * and lets the display heading break an otherwise-unbreakable word
   * before it overflows the shell. Both declarations are no-ops on any
   * page whose hero content already fits -- min-width: 0 only ever
   * removes a width floor, and overflow-wrap: break-word only activates
   * when normal wrapping would otherwise overflow -- so this is safe as
   * an unconditional default across every .nlc-service hero.
   */
  .nlc-service__hero-grid,
  .nlc-service__hero-copy,
  .nlc-service__hero .nlc-service__actions {
    min-width: 0;
  }

  .nlc-service__hero-copy .nlc-service__display {
    overflow-wrap: break-word;
  }

  .nlc-service__media {
    min-height: 18rem;
  }

  .nlc-service__cards,
  .nlc-service__route-grid {
    grid-template-columns: 1fr;
  }

  .nlc-service__card {
    min-height: 0;
  }

  .nlc-service__card-number {
    margin-bottom: 3rem;
  }
}

@media (max-width: 640px) {
  .nlc-service {
    /* Keep the phone-width content box inside the viewport after applying
     * the same 1.15rem shell gutters on both sides at this breakpoint. */
    --nlc-content: calc(100vw - 2.3rem);
  }

  .nlc-service__shell {
    padding-inline: 1.15rem;
  }

  /*
   * Family 1 mobile hero guardrail (NLC-DEV-20260824-07, refined
   * NLC-DEV-20260824-08). The prior clamp(3.25rem, 17vw, 5rem) let the bold
   * anchor line's rendered word width exceed the shell's inner padding
   * boundary on narrow phones (confirmed real overflow on
   * motorcoach-service at 390/375/320px in NLC-DEV-20260824-06 -- the word
   * "movement," ran ~50px past the shell edge and was silently clipped by
   * .nlc-service's overflow: clip). NLC-DEV-20260824-07 fixed the hard
   * overflow with clamp(2.75rem, 13.5vw, 4.5rem), but at 320px the 2.75rem
   * floor still bound above the 13.5vw curve (44px actual), leaving only
   * ~10px of margin. NLC-DEV-20260824-08 lowers both the floor and the vw
   * coefficient so the vw curve determines the value at all three required
   * widths (320/375/390px) instead of the floor overriding it at the
   * narrowest width, restoring the required safety margin from the
   * guardrail doc without touching line-height, HTML, or page-local CSS.
   */
  .nlc-service__display {
    font-size: clamp(2.5rem, 12.75vw, 4.5rem);
  }

  .nlc-service__actions {
    align-items: stretch;
    flex-direction: column;
  }

  .nlc-service__button {
    width: 100%;
  }

  .nlc-service__band-grid {
    grid-template-columns: 1fr;
    padding-block: 0.4rem;
  }

  .nlc-service__band-grid span {
    min-height: 3.25rem;
    padding-inline: 0;
  }

  .nlc-service__band-grid span + span {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.24);
  }
}

/*
 * Floating "Book Online" trigger (NLC-DEV-20260801-04, refined NLC-DEV-20260801-04-C01).
 * Opt-in: only renders where the page markup includes an element with
 * data-nlc-floating-trigger="scroll". Visible and functional with no
 * JavaScript by default; JS only adds/removes --pending to time the reveal
 * around the hero and hide it near the closing CTA to avoid collision.
 * C01: editorial Playfair treatment, stronger border contrast, decorative
 * icon, and a smaller ≤480px footprint to reduce (not fully eliminate) the
 * documented no-JS bottom collision with the closing section's CTAs.
 */
.nlc-service__floating-booker {
  align-items: center;
  background: var(--nlc-accent);
  border-bottom: 2px solid rgba(255, 255, 255, 0.35);
  border-left: 4px solid var(--nlc-cream);
  border-radius: 4px;
  border-right: 2px solid rgba(255, 255, 255, 0.35);
  border-top: 2px solid rgba(255, 255, 255, 0.35);
  bottom: 20px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
  color: var(--nlc-on-accent-alt);
  display: inline-flex;
  font-family: var(--nlc-display);
  font-size: clamp(0.95rem, 1.5vw, 1rem);
  font-weight: 700;
  gap: 0.5rem;
  justify-content: center;
  letter-spacing: 2px;
  min-height: 3rem;
  opacity: 1;
  padding: 0.75rem 1.25rem;
  pointer-events: auto;
  position: fixed;
  right: 20px;
  text-decoration: none;
  text-transform: capitalize;
  transform: translateY(0);
  transition: opacity 220ms ease, transform 220ms ease, background-color 180ms ease;
  white-space: nowrap;
  z-index: 60;
}

.nlc-service__floating-booker-icon {
  flex-shrink: 0;
  height: 14px;
  width: 14px;
}

.nlc-service__floating-booker--pending {
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
}

.nlc-service__floating-booker:hover,
.nlc-service__floating-booker:focus-visible {
  background: var(--nlc-accent-deep);
}

@media (max-width: 480px) {
  .nlc-service__floating-booker {
    bottom: max(14px, env(safe-area-inset-bottom, 14px));
    font-size: 0.85rem;
    letter-spacing: 1.4px;
    min-height: 2.75rem;
    padding: 0.6rem 0.9rem;
    right: 14px;
  }

  .nlc-service__floating-booker-icon {
    height: 12px;
    width: 12px;
  }
}

/*
 * WordPress/Divi cascade hardening for the floating "Book Online" trigger
 * (NLC-DEV-20260803-01-C03). The accepted rule above is present in the live
 * WordPress style block and matches the element, but it loses the cascade
 * against the Pro/Divi theme's own link reset because this class was not
 * previously covered by any #et-boc .et-l .nlc-service.nlc-service hardening
 * rule. Scoped only to properties confirmed drifted by live computed-style
 * verification: background, border, border-radius, color, font-weight,
 * letter-spacing, padding, text-transform. display/min-height/font-family/
 * the --pending hidden state were all confirmed NOT drifted and are
 * intentionally left unhardened.
 */
#et-boc .et-l .nlc-service.nlc-service .nlc-service__floating-booker {
  background: var(--nlc-accent) !important;
  border-bottom: 2px solid rgba(255, 255, 255, 0.35) !important;
  border-left: 4px solid var(--nlc-cream) !important;
  border-radius: 4px !important;
  border-right: 2px solid rgba(255, 255, 255, 0.35) !important;
  border-top: 2px solid rgba(255, 255, 255, 0.35) !important;
  color: var(--nlc-on-accent-alt) !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  padding: 0.75rem 1.25rem !important;
  text-transform: capitalize !important;
}

#et-boc .et-l .nlc-service.nlc-service .nlc-service__floating-booker:hover,
#et-boc .et-l .nlc-service.nlc-service .nlc-service__floating-booker:focus-visible {
  background: var(--nlc-accent-deep) !important;
}

/* Floating Booker left border lighter, light mode only, sitewide (the shared
 * 4px solid var(--nlc-cream) border flips near-black in light mode and reads
 * as a dark artifact against the accent panel). Promoted from Corporate
 * Car's page-local fix (NLC-DEV-20260826-17) to shared CSS (NLC-DEV-20260829-30). */
[data-theme="light"] .nlc-service__floating-booker {
  border-left-color: var(--nlc-rule);
}

[data-theme="light"] #et-boc .et-l .nlc-service.nlc-service .nlc-service__floating-booker {
  border-left-color: var(--nlc-rule) !important;
}

@media (max-width: 480px) {
  #et-boc .et-l .nlc-service.nlc-service .nlc-service__floating-booker {
    letter-spacing: 1.4px !important;
    padding: 0.6rem 0.9rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .nlc-service *,
  .nlc-service *::before,
  .nlc-service *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
  }
}