/* ACXPA — Sector Comparisons
   ---------------------------------------------------------------------------
   Feature stylesheet for /call-centre-rankings/sector-comparisons/ and its
   staging copy at /testing-page-three/. Section 21c location 4: one file per
   content type, enqueued only on the pages that need it.

   Same design language as acxpa-national-spread.css — light hero, one tab
   strip as a segmented track, light panels — with its own prefix because it is
   a different content type and the two must be able to move independently.

   Built against acxpa-tokens.css v1.2.0 and ACXPA Brand & Digital Standards
   v1.9. No hex literals, no var() fallbacks, no !important (s21b, s21d).
   --------------------------------------------------------------------------- */

#acxpasc {
  color: var(--acxpa-ds-ink);
  font-family: var(--acxpa-ds-font);
  font-size: 16px;
  line-height: 1.6;
}

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

#acxpasc .wpb_text_column,
#acxpasc .wpb_wrapper,
#acxpasc .wpb_content_element { margin-bottom: 0; }

#acxpasc img { height: auto; }

/* --- Hero ------------------------------------------------------------------
   Light, for the reason set out in acxpa-national-spread.css: the site chrome
   is Teal 800 and a dark band directly beneath it reads as more chrome
   whatever hue it takes (s13b.4). Teal 50 is dE 75.8 from the nav. */

#acxpasc .acxpasc-hero {
  padding: var(--acxpa-ds-space-2xl);
  margin: 0 0 var(--acxpa-ds-space-lg);
  background: var(--acxpa-ds-teal-50);
  border-top: 6px solid var(--acxpa-ds-gold);
  border-radius: var(--acxpa-ds-radius-xl);
  box-shadow: var(--acxpa-ds-shadow-md);
}

/* The greeting carries the [firstname] shortcode. It is its own line rather
   than part of the heading because the shortcode resolves to nothing when a
   member has no first name on file, and "Hi , here are..." is what that costs
   inside a sentence. "Welcome back" alone still reads. */
#acxpasc .acxpasc-hero h2 {
  margin: 0 0 var(--acxpa-ds-space-sm);
  color: var(--acxpa-ds-ink);
  font-size: var(--acxpa-ds-text-h2);
  line-height: var(--acxpa-ds-leading-tight);
  font-weight: 700;
  text-align: center;
}

#acxpasc .acxpasc-hero h3 {
  margin: 0 0 var(--acxpa-ds-space-md);
  color: var(--acxpa-ds-slate);
  font-size: var(--acxpa-ds-text-lead);
  font-weight: 600;
  text-align: center;
}

#acxpasc .acxpasc-hero p {
  margin: 0 0 var(--acxpa-ds-space-sm);
  color: var(--acxpa-ds-ink);
}

/* The members hero is a short standfirst rather than four paragraphs of
   argument, so it centres with its headings instead of sitting left of them. */
#acxpasc.acxpasc--members .acxpasc-hero p { text-align: center; }
#acxpasc.acxpasc--members .acxpasc-hero p:last-child { margin-bottom: 0; }

/* Gold measures 1.71:1 on this ground and cannot carry text here. */
#acxpasc .acxpasc-hero a { color: var(--acxpa-ds-link); }
#acxpasc .acxpasc-hero a:hover { color: var(--acxpa-ds-link-hover); }

/* --- Audience note ---------------------------------------------------------
   One per level, gated by the site's hide-for-* classes on a bare wrapper. */

/* The gating wrapper IS the card here — there is no inner div, which is why
   this rule matched nothing and the note rendered as bare text above the tab
   label. Same shape of mistake as the outro cards. */
#acxpasc .acxpasc-audience > div {
  padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg);
  margin: 0 0 var(--acxpa-ds-space-lg);
  background: var(--acxpa-ds-teal-100);
  border-left: 4px solid var(--acxpa-ds-teal-700);
  border-radius: var(--acxpa-ds-radius-md);
  color: var(--acxpa-ds-ink);
}

#acxpasc .acxpasc-audience p { margin: 0 0 var(--acxpa-ds-space-2xs); }
#acxpasc .acxpasc-audience p:last-child { margin: 0; }

/* --- Tab strip -------------------------------------------------------------
   A segmented track, not five loose buttons. The panels are tall — a
   definition, two boards and a chart each — so the strip is repeated below the
   panel as well, and the bottom copy scrolls the reader back to the top of
   whichever metric they pick. */

#acxpasc .acxpasc-tabsLabel {
  display: block;
  margin: 0 0 var(--acxpa-ds-space-xs);
  color: var(--acxpa-ds-slate);
  font-size: var(--acxpa-ds-text-caption);
  font-weight: 700;
  letter-spacing: var(--acxpa-ds-tracking-eyebrow);
  text-transform: uppercase;
}

#acxpasc .acxpasc-tabs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--acxpa-ds-space-2xs);
  margin: 0 0 var(--acxpa-ds-space-xl);
  padding: var(--acxpa-ds-space-2xs);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-stone);
  border-radius: var(--acxpa-ds-radius-lg);
  box-shadow: var(--acxpa-ds-shadow-sm);
}

#acxpasc .acxpasc-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--acxpa-ds-space-2xs);
  width: 100%;
  padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-xs);
  background: transparent;
  border: 0;
  border-radius: var(--acxpa-ds-radius-md);
  color: var(--acxpa-ds-ink);
  font-size: var(--acxpa-ds-text-small);
  font-weight: 700;
  line-height: var(--acxpa-ds-leading-snug);
  text-align: center;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}

#acxpasc .acxpasc-tab:hover { background: var(--acxpa-ds-teal-50); }

#acxpasc .acxpasc-tab:focus-visible {
  outline: 3px solid var(--acxpa-ds-link);
  outline-offset: 2px;
}

/* Ink, not Teal 700: Teal 700 is the s8b Exceeds Standards fill and this page
   prints that swatch in every board's colour legend (s8c, s8d). */
#acxpasc .acxpasc-tab.is-on {
  background: var(--acxpa-ds-ink);
  color: var(--acxpa-ds-text-on-dark);
}

#acxpasc .acxpasc-tabNum {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: var(--acxpa-ds-radius-pill);
  background: var(--acxpa-ds-teal-100);
  color: var(--acxpa-ds-ink);
  font-size: var(--acxpa-ds-text-caption);
}

#acxpasc .acxpasc-tab.is-on .acxpasc-tabNum {
  background: color-mix(in srgb, var(--acxpa-ds-white) 20%, transparent);
  color: var(--acxpa-ds-text-on-dark);
}

/* A second copy of the strip below the panel repeated the same five choices
   without adding a decision, so the foot carries one link back to the strip
   instead. */
/* --- Grouped tab strip, members page ---------------------------------------
   Thirteen metrics is past what one row of segments can carry, so they keep
   the three groups the page already used - key metrics, the Agent Mastery
   competencies, and the time metrics - with the segmented treatment applied
   within each group. */

#acxpasc .acxpasc-tabGroups {
  display: grid;
  gap: var(--acxpa-ds-space-md);
  margin: 0 0 var(--acxpa-ds-space-xl);
  padding: var(--acxpa-ds-space-lg);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-stone);
  border-radius: var(--acxpa-ds-radius-lg);
  box-shadow: var(--acxpa-ds-shadow-sm);
}

#acxpasc .acxpasc-tabGroup + .acxpasc-tabGroup {
  padding-top: var(--acxpa-ds-space-md);
  border-top: 1px solid var(--acxpa-ds-cloud);
}

#acxpasc .acxpasc-tabGroupName {
  margin: 0 0 var(--acxpa-ds-space-xs);
  color: var(--acxpa-ds-slate);
  font-size: var(--acxpa-ds-text-caption);
  font-weight: 700;
  letter-spacing: var(--acxpa-ds-tracking-eyebrow);
  text-transform: uppercase;
}

/* Flex, not a grid of equal columns: the three groups hold three, five and
   five metrics, so equal columns made a three-item row into three enormous
   blocks and left the inactive ones looking like plain text. Pills sized to
   their label line up across all three rows and read as controls whether they
   are selected or not. */
#acxpasc .acxpasc-tabGroup .acxpasc-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--acxpa-ds-space-2xs);
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

#acxpasc .acxpasc-tabGroup .acxpasc-tab {
  width: auto;
  padding: var(--acxpa-ds-space-2xs) var(--acxpa-ds-space-md);
  border: 1px solid var(--acxpa-ds-stone);
  border-radius: var(--acxpa-ds-radius-pill);
  background: var(--acxpa-ds-white);
}

#acxpasc .acxpasc-tabGroup .acxpasc-tab:hover {
  background: var(--acxpa-ds-teal-50);
  border-color: var(--acxpa-ds-teal-300);
}

#acxpasc .acxpasc-tabGroup .acxpasc-tab.is-on {
  background: var(--acxpa-ds-ink);
  border-color: var(--acxpa-ds-ink);
  color: var(--acxpa-ds-text-on-dark);
}

#acxpasc .acxpasc-tabsFoot {
  padding: var(--acxpa-ds-space-md) 0 0;
  margin: var(--acxpa-ds-space-md) 0 var(--acxpa-ds-space-lg);
  border-top: 1px solid var(--acxpa-ds-stone);
  text-align: center;
}

#acxpasc a.acxpasc-back {
  display: inline-block;
  padding: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-lg);
  border: 1px solid var(--acxpa-ds-stone);
  border-radius: var(--acxpa-ds-radius-pill);
  background: var(--acxpa-ds-white);
  color: var(--acxpa-ds-link);
  font-size: var(--acxpa-ds-text-small);
  font-weight: 700;
  text-decoration: none;
}

#acxpasc a.acxpasc-back:hover,
#acxpasc a.acxpasc-back:focus-visible {
  background: var(--acxpa-ds-teal-50);
  color: var(--acxpa-ds-link-hover);
}

/* --- The band key ----------------------------------------------------------
   One key for the pair of boards, sitting under both, because the scale
   applies to both and printing it twice says it is two different scales. The
   page renders its own rather than lifting the board's: the board copy is
   being switched off, and a key that vanishes when a plugin setting changes is
   not a key.

   Only the three banded metrics get one. Calls Answered % and Average Wait
   Time are measured quantities with no band (s8d). */

#acxpasc .acxpasc-bandKey {
  max-width: none;
  margin: 0 0 var(--acxpa-ds-space-lg);
  padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-stone);
  border-radius: var(--acxpa-ds-radius-lg);
  box-shadow: var(--acxpa-ds-shadow-sm);
}

#acxpasc .acxpasc-bandKey .acxpa-band-key__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-lg);
}

#acxpasc .acxpasc-bandKey .acxpa-band-key__row { padding: 0; }

#acxpasc .acxpasc-bandKey .acxpa-band-key__title,
#acxpasc .acxpasc-bandKey .acxpa-band-key__foot { text-align: center; }

/* Whatever the boards themselves render stays out of the way, switched off in
   the plugin or not. */
#acxpasc .acxpasc-board .acxpa-band-key,
#acxpasc .acxpasc-board .acxpa-band-key__link { display: none; }

/* --- Panels ---------------------------------------------------------------- */

/* Inactive panels are hidden with visibility, not display, and they keep their
   full width.

   The trend charts are Google Charts, which draws once into whatever size the
   container reports and never re-measures. With display:none the four inactive
   panels reported zero width at draw time, so only the first metric's chart
   came out right and the other four were drawn into nothing. Absolutely
   positioning them inside a relative wrapper keeps them the width of the
   column while taking them out of flow, so every chart is drawn at the size it
   will actually be seen at.

   visibility:hidden also keeps them out of the tab order and the accessibility
   tree, which display:none did and opacity alone would not. */

#acxpasc .acxpasc-panels { position: relative; }

#acxpasc .acxpasc-panel {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 0;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  padding: var(--acxpa-ds-space-xl);
  margin: 0 0 var(--acxpa-ds-space-lg);
  background: var(--acxpa-ds-sand);
  border: 1px solid var(--acxpa-ds-stone);
  border-radius: var(--acxpa-ds-radius-xl);
}

#acxpasc .acxpasc-panel.is-on {
  position: relative;
  z-index: 1;
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

#acxpasc .acxpasc-panelHead { margin: 0 0 var(--acxpa-ds-space-lg); }

#acxpasc .acxpasc-eyebrow {
  margin: 0 0 var(--acxpa-ds-space-2xs);
  color: var(--acxpa-ds-slate);
  font-size: var(--acxpa-ds-text-caption);
  font-weight: 700;
  letter-spacing: var(--acxpa-ds-tracking-eyebrow);
  text-transform: uppercase;
}

#acxpasc .acxpasc-panelTitle {
  margin: 0 0 var(--acxpa-ds-space-sm);
  color: var(--acxpa-ds-ink);
  font-size: var(--acxpa-ds-text-h3);
  line-height: var(--acxpa-ds-leading-tight);
  font-weight: 700;
}

#acxpasc .acxpasc-def { margin: 0 0 var(--acxpa-ds-space-sm); }

#acxpasc .acxpasc-list {
  margin: 0;
  padding-left: var(--acxpa-ds-space-lg);
}

#acxpasc .acxpasc-list li { margin: 0 0 var(--acxpa-ds-space-2xs); }

/* --- Boards and chart ------------------------------------------------------ */

#acxpasc .acxpasc-boards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--acxpa-ds-space-lg);
  margin: 0 0 var(--acxpa-ds-space-lg);
}

/* Three timeframes side by side on the members page.

   This has to sit AFTER .acxpasc-boards, not before it: both selectors are
   (1,1,0), so a tie is settled by source order, and written earlier in the
   file it lost silently and the three boards rendered two-up. Exactly the
   s20e failure - an exception that reads as correct and does nothing. */
#acxpasc .acxpasc-boards--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--acxpa-ds-space-md);
}

#acxpasc .acxpasc-board,
#acxpasc .acxpasc-chart {
  padding: var(--acxpa-ds-space-lg);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-stone);
  border-radius: var(--acxpa-ds-radius-lg);
  box-shadow: var(--acxpa-ds-shadow-sm);
}

#acxpasc .acxpasc-chart { margin: 0 0 var(--acxpa-ds-space-lg); }

#acxpasc .acxpasc-boardTitle {
  margin: 0 0 var(--acxpa-ds-space-2xs);
  color: var(--acxpa-ds-ink);
  font-size: var(--acxpa-ds-text-small);
  font-weight: 700;
  letter-spacing: var(--acxpa-ds-tracking-eyebrow);
  text-transform: uppercase;
}

#acxpasc .acxpasc-boardNote {
  margin: 0 0 var(--acxpa-ds-space-sm);
  color: var(--acxpa-ds-slate);
  font-size: var(--acxpa-ds-text-caption);
}

/* The plugin paints its own card behind each board. Inside these cards that is
   a second frame around a frame — and it also costs contrast: the quarter
   label is Gold Deep, which reads 4.46:1 on the plugin's own #f2f2f2 and
   4.99:1 on white, so removing the fill is what brings it over the 4.5 floor.
   !important is required because the plugin writes the fill as an inline
   style attribute, which nothing else can beat (s21e.2). */
#acxpasc .acxpasc-board .acxpa-leaderboard,
#acxpasc .acxpasc-chart .ays-chart-container {
  width: 100%;
  margin: 0;
  background: transparent !important;
  border: 0;
  box-shadow: none;
}

/* --- About this metric ----------------------------------------------------- */

#acxpasc .acxpasc-about {
  margin: 0 0 var(--acxpa-ds-space-lg);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-stone);
  border-left: 4px solid var(--acxpa-ds-gold);
  border-radius: var(--acxpa-ds-radius-md);
  overflow: hidden;
}

#acxpasc .acxpasc-about > summary {
  display: flex;
  align-items: center;
  gap: var(--acxpa-ds-space-xs);
  padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md);
  color: var(--acxpa-ds-ink);
  font-size: var(--acxpa-ds-text-small);
  font-weight: 700;
  list-style: none;
  cursor: pointer;
}

#acxpasc .acxpasc-about > summary::-webkit-details-marker { display: none; }

#acxpasc .acxpasc-about > summary::after {
  content: "";
  width: 9px;
  height: 9px;
  margin-left: auto;
  border-right: 2px solid var(--acxpa-ds-slate);
  border-bottom: 2px solid var(--acxpa-ds-slate);
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform .15s ease;
}

#acxpasc .acxpasc-about[open] > summary::after {
  transform: rotate(-135deg) translate(-2px, -2px);
}

#acxpasc .acxpasc-aboutBody {
  padding: 0 var(--acxpa-ds-space-md) var(--acxpa-ds-space-md);
  color: var(--acxpa-ds-ink);
  font-size: var(--acxpa-ds-text-small);
}

#acxpasc .acxpasc-aboutBody p { margin: 0 0 var(--acxpa-ds-space-sm); }
#acxpasc .acxpasc-aboutBody p:last-child { margin: 0; }

/* --- Next steps, and the closing block ------------------------------------- */

/* And again at the foot of each panel: the member and subscriber next-step
   lines had no card at all, so a long sentence ran the width of the panel as
   naked underlined text. */
#acxpasc .acxpasc-nextSteps > div {
  padding: var(--acxpa-ds-space-sm) var(--acxpa-ds-space-md);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-stone);
  border-left: 4px solid var(--acxpa-ds-gold);
  border-radius: var(--acxpa-ds-radius-md);
}

#acxpasc .acxpasc-nextSteps p { margin: 0; }

#acxpasc .acxpasc-nextSteps a {
  color: var(--acxpa-ds-link);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: .15em;
}

#acxpasc .acxpasc-nextSteps a:hover { color: var(--acxpa-ds-link-hover); }

#acxpasc .acxpasc-outro {
  padding: var(--acxpa-ds-space-xl);
  margin: var(--acxpa-ds-space-lg) 0 0;
  background: var(--acxpa-ds-teal-50);
  border-radius: var(--acxpa-ds-radius-xl);
}

#acxpasc .acxpasc-outro h2 {
  margin: 0 0 var(--acxpa-ds-space-sm);
  color: var(--acxpa-ds-ink);
  font-size: var(--acxpa-ds-text-h3);
  font-weight: 700;
  text-align: center;
}

#acxpasc .acxpasc-outro > p {
  max-width: none;
  margin: 0 auto var(--acxpa-ds-space-lg);
  text-align: center;
}

/* The closing cards were four different inline blues, yellows and greens. They
   are one shape now, with the gold rail marking the paid step.

   The gating wrapper is one level deep, not two: .acxpasc-outro > div (the
   hide-for-* wrapper) > div (the card). Written a level too deep, this rule
   matched nothing and the cards rendered as loose headings and paragraphs with
   the buttons jammed against them. */
#acxpasc .acxpasc-outro > div > div {
  padding: var(--acxpa-ds-space-md) var(--acxpa-ds-space-lg);
  margin: 0 0 var(--acxpa-ds-space-md);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-stone);
  border-left: 4px solid var(--acxpa-ds-gold);
  border-radius: var(--acxpa-ds-radius-md);
}

#acxpasc .acxpasc-outro > div > div:last-child { margin-bottom: 0; }

/* The members page closes with three destinations, not a ladder of paid
   steps, so its cards sit side by side. The gating wrapper level is KEPT even though
   nothing is gated here, so `.acxpasc-outro > div > div` above still matches -
   changing the depth and leaving the card rule behind is the exact mistake
   this file has already made three times (s20e). */
#acxpasc.acxpasc--members .acxpasc-outro > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--acxpa-ds-space-md);
  align-items: stretch;
}

/* Cards stretch to the tallest of the three and the button is pushed to the
   foot of each, so the three calls to action sit on one line instead of
   stepping down with the length of the paragraph above them. */
#acxpasc.acxpasc--members .acxpasc-outro > div > div {
  display: flex;
  flex-direction: column;
  margin: 0;
}

/* The button paragraph is named rather than reached as :last-child. wpautop
   leaves an empty <p> at the foot of each card, so :last-child was that empty
   paragraph and the auto margin pushed NOTHING to the bottom - the rule looked
   right and did nothing, which is s20e again. The empty paragraphs are removed
   from flow here as well. */
#acxpasc.acxpasc--members .acxpasc-outro > div > div > p.acxpasc-ctaRow {
  margin: auto 0 0;
  padding-top: var(--acxpa-ds-space-xs);
}

#acxpasc .acxpasc-outro p:empty { display: none; }

#acxpasc .acxpasc-outro h4 {
  margin: 0 0 var(--acxpa-ds-space-xs);
  color: var(--acxpa-ds-ink);
  font-size: var(--acxpa-ds-text-body);
  font-weight: 700;
}

#acxpasc .acxpasc-outro p { margin: 0 0 var(--acxpa-ds-space-xs); }
#acxpasc .acxpasc-outro p:last-child { margin: 0; }

/* s13 Call to action: Gold on Ink, 8.49:1. Scoped through #acxpasc so it
   outranks `.main-color a` in the generated theme file, which enqueues later
   (s20c, s20e). */
#acxpasc a.acxpasc-cta {
  display: inline-block;
  margin-top: var(--acxpa-ds-space-2xs);
  padding: var(--acxpa-ds-space-xs) var(--acxpa-ds-space-lg);
  border-radius: var(--acxpa-ds-radius-md);
  background: var(--acxpa-ds-gold);
  color: var(--acxpa-ds-ink);
  font-size: var(--acxpa-ds-text-small);
  font-weight: 700;
  text-decoration: none;
  transition: background-color .15s ease;
}

#acxpasc a.acxpasc-cta:hover,
#acxpasc a.acxpasc-cta:focus-visible {
  background: var(--acxpa-ds-gold-deep);
  color: var(--acxpa-ds-text-on-dark);
}

#acxpasc .acxpasc-outro a:not(.acxpasc-cta) {
  color: var(--acxpa-ds-link);
  text-decoration: underline;
  text-underline-offset: .15em;
}

/* --- Narrow ---------------------------------------------------------------- */

@media screen and (max-width: 900px) {
  #acxpasc .acxpasc-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #acxpasc .acxpasc-boards,
  #acxpasc .acxpasc-boards--three { grid-template-columns: minmax(0, 1fr); }
  #acxpasc.acxpasc--members .acxpasc-outro > div { grid-template-columns: minmax(0, 1fr); }
}

@media screen and (max-width: 600px) {
  #acxpasc .acxpasc-tabs { grid-template-columns: minmax(0, 1fr); }
  #acxpasc .acxpasc-hero,
  #acxpasc .acxpasc-panel.is-on,
  #acxpasc .acxpasc-outro { padding: var(--acxpa-ds-space-lg); }
}
