/* site-footer.css — the shared site footer, consolidated from the
   .site-footer rules built for index.html (assets/discover-v12/page.css).
   Link this after each page's own stylesheet on every interior page so
   the footer matches the home page. Home page keeps its rules in
   page.css untouched; this file is a faithful copy, not the source of
   truth, so a future footer redesign has to be re-synced by hand. */

.site-footer {
  --ft-line: rgba(var(--em-rgb-white), 0.1);
  --ft-gold: var(--unveil-gold, var(--em-text-accent-on-inverse));
  --ft-ink: var(--em-text-on-inverse);
  --ft-mute: rgba(var(--em-rgb-on-inverse), 0.42);
  --ft-p: 0;
  --font-nav: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
  --font-display: Optima, "Optima Nova", Candara, "Trebuchet MS", sans-serif;
  /* The footer's ground is ONE value: the warm near-black declared below at
     §Footer. This block used to declare #050505 and be overridden by it, which
     left two footer blacks in one stylesheet and anything matching the footer
     — the mobile More sheet's gradient — matching the wrong one. */
  background: var(--p-night-800);
  color: var(--ft-ink);
  font-family: var(--font-nav), system-ui, sans-serif;
}

@media (min-width: 1024px) {
.site-footer.is-shutter-pin {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(0, calc((1 - var(--ft-p, 0)) * 56px), 0);
    will-change: transform;
  }

.site-footer.is-shutter-pin.is-revealing {
    visibility: visible;
    pointer-events: auto;
  }
}

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

.site-footer__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--ft-line);
}

.site-footer__col {
  padding: clamp(3.25rem, 6vw, 5.25rem) clamp(1.4rem, 2.4vw, 2.5rem) clamp(2.75rem, 5vw, 4.25rem);
  border-right: 1px solid var(--ft-line);
}

.site-footer__col:last-child {
  border-right: 0;
}

.site-footer__heading {
  margin: 0 0 1.65rem;
  font-family: var(--font-nav), system-ui, sans-serif;
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.22em;
  color: var(--em-text-eyebrow-neutral-on-inverse);
}

.site-footer__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-footer__list a,
.site-footer__list button {
  display: inline-block;
  padding: 0.28rem 0;
  color: var(--ft-ink);
  font-size: 0.98rem;
  font-weight: 400;
  line-height: 1.7;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.site-footer__list a:hover,
.site-footer__list button:hover {
  opacity: 0.62;
}

.site-footer__lede {
  margin: 0 0 1.7rem;
  max-width: 18rem;
  color: var(--p-brand-white);
  font-size: 0.98rem;
  line-height: 1.65;
}

.site-footer__form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.75rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid rgba(var(--em-rgb-white), 0.88);
}

.site-footer__field {
  display: block;
  min-width: 0;
}

.site-footer__field input {
  width: 100%;
  padding: 0.15rem 0 0.2rem;
  border: 0;
  background: transparent;
  color: var(--ft-ink);
  font-family: inherit;
  font-size: 0.95rem;
  /* Resting only. The bare `outline: none` that used to stand here with
     nothing after it killed the global :focus-visible ring and put nothing
     back — this was the only focusable element on any page carrying the
     footer with no visible focus state at all (WCAG 2.4.7). */
  outline: none;
}

/* Keyboard only: a mouse user clicking into a text field does not need to be
   told where they clicked. Cream, because the footer is a night ground. */
.site-footer__field input:focus-visible {
  outline: 2px solid var(--ft-ink);
  outline-offset: 2px;
}

.site-footer__field input::placeholder {
  color: rgba(var(--em-rgb-on-inverse), 0.38);
}

.site-footer__submit {
  padding: 0 0 0.15rem;
  border: 0;
  background: none;
  color: var(--ft-ink);
  font-family: inherit;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  cursor: pointer;
}

.site-footer__submit:hover {
  opacity: 0.62;
}

.site-footer__thanks {
  margin: 0.85rem 0 0;
  color: var(--ft-gold);
  font-size: 0.82rem;
}

.site-footer.is-subscribed .site-footer__form {
  display: none;
}

.site-footer__social {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  margin: 1.7rem 0 0;
  padding: 0;
  list-style: none;
}

.site-footer__social a {
  display: grid;
  place-items: center;
  width: 2.15rem;
  height: 2.15rem;
  border: 1px solid rgba(var(--em-rgb-white), 0.55);
  border-radius: 50%;
  color: var(--ft-ink);
  transition: border-color 0.2s ease, opacity 0.2s ease;
}

.site-footer__social a:hover {
  opacity: 0.62;
}

.site-footer__social svg {
  width: 0.95rem;
  height: 0.95rem;
}

.site-footer__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  padding: 1.15rem clamp(1.4rem, 2.4vw, 2.5rem);
  border-top: 1px solid var(--ft-line);
}

.site-footer__explore-all {
  color: var(--ft-ink);
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
}

.site-footer__explore-all span {
  margin-left: 0.35rem;
}

.site-footer__explore-all:hover {
  opacity: 0.62;
}

.site-footer__legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 1.15rem 1.5rem;
  color: var(--p-brand-white);
  font-size: 0.72rem;
}

.site-footer__legal p {
  margin: 0;
}

.site-footer__legal a,
.site-footer__prefs,
.site-footer__replay {
  color: var(--ft-ink);
  font-size: 0.72rem;
  text-decoration: none;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font-family: inherit;
}

.site-footer__legal a:hover,
.site-footer__prefs:hover,
.site-footer__replay:hover {
  opacity: 0.62;
}

.site-footer__replay {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.66rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ft-ink);
}

.site-footer__replay svg {
  width: 0.85rem;
  height: 0.85rem;
}

@media (max-width: 980px) {
.site-footer__grid {
    grid-template-columns: 1fr 1fr;
  }

.site-footer__col:nth-child(2) {
    border-right: 0;
  }

.site-footer__col:nth-child(1),
  .site-footer__col:nth-child(2) {
    border-bottom: 1px solid var(--ft-line);
  }

.site-footer__bar {
    flex-direction: column;
    align-items: flex-start;
  }

.site-footer__legal {
    justify-content: flex-start;
  }
}

.comm-collage__viewing,
.site-footer__explore-all {
  display: inline-flex;
  align-items: center;
  min-height: var(--em-control-min);
}

.site-footer__list a,
.site-footer__list button {
  padding: 0.55rem 0;
}

.site-footer__social a {
  width: 2.75rem;
  height: var(--em-control-min);
}

.site-footer__legal a,
.site-footer__prefs,
.site-footer__replay {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--em-control-min);
  min-width: 2.75rem;
}

.site-footer__submit {
  min-height: var(--em-control-min);
  padding: 0 0.25rem;
}

.site-footer__form input[type="email"],
.site-footer__form input {
  min-height: var(--em-control-min);
}

@media (max-width: 640px) {
.site-footer__grid {
    grid-template-columns: 1fr;
  }

.site-footer__col {
    border-right: 0;
    border-bottom: 1px solid var(--ft-line);
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

.site-footer__col:nth-child(2) {
    border-bottom: 1px solid var(--ft-line);
  }

.site-footer__col:last-child {
    border-bottom: 0;
  }

.site-footer__bar {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}

/* 4.25rem was 68px against a 72px bar, so every in-page jump landed 4px
   under the header — and this rule out-ranks nothing, it simply loads after
   places.css's `section[id] { scroll-margin-top: calc(var(--em-hdr) + 12px) }`
   and wins on source order at equal specificity, silently undoing it on every
   page that carries this footer. On emaar-completed.html that sliced 8px off
   the top of a chapter's photograph on every #done-* jump below 1024.
   Same expression now, with a literal fallback for the four pages that load
   this footer without places.css and so have no --em-hdr to read. */
section[id],
footer[data-site-footer] {
  scroll-margin-top: calc(var(--em-hdr, 72px) + 12px);
}

@media (max-width: 1023px) {
.site-footer__bar {
    padding-bottom: 5.5rem;
  }
}

.mobile-more .site-footer__bar {
  padding-bottom: 1.5rem;
}

.mark-glyph {
  display: inline-flex;
  align-items: stretch;
  line-height: 0;
}

.mark-glyph svg,
.mark-num svg {
  display: block;
  height: 1em;
  width: auto;
  fill: currentColor;
  overflow: visible;
}

html[dir="rtl"] .comm-collage__explore svg,
html[dir="rtl"] .site-footer__explore-all span {
  transform: scaleX(-1);
}

.site-footer {
  --ft-line: rgba(var(--em-rgb-on-inverse), 0.12);
  --ft-gold: var(--em-text-accent-on-inverse);
  --ft-ink: var(--em-text-on-inverse);
  --ft-mute: rgba(var(--em-rgb-on-inverse), 0.55);
  background: var(--p-night-800);
}

.site-footer__top {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: clamp(28px, 5vw, 80px);
  padding: clamp(52px, 10vh, 170px) clamp(22px, 5vw, 88px) clamp(38px, 6vh, 96px);
  border-bottom: 1px solid rgba(var(--em-rgb-on-inverse), 0.14);
}

.site-footer__lockup {
  flex: 1 1 26rem;
  min-width: min(300px, 100%);
}

.site-footer__mark {
  display: flex;
  align-items: flex-start;
  margin: 0;
  font-size: clamp(28px, 3.6vw, 52px);
  color: var(--ft-ink);
}

.site-footer__mark .mark-glyph svg {
  height: 1em;
  width: auto;
  display: block;
}

.site-footer__mark .mark-glyph:nth-child(2) svg {
  margin-left: 0.0497em;
}

.site-footer__mark .mark-glyph:nth-child(3) svg {
  margin-left: 0.0184em;
}

.site-footer__mark .mark-glyph:nth-child(4) svg {
  margin-left: 0.0156em;
}

.site-footer__mark .mark-glyph:nth-child(5) svg {
  margin-left: 0.0288em;
}

.site-footer__line {
  margin: clamp(24px, 3vw, 40px) 0 0;
  max-width: 20em;
  font-family: var(--font-display), Candara, "Trebuchet MS", sans-serif;
  font-size: clamp(24px, 2.6vw, 38px);
  font-weight: 400;
  line-height: 1.08;
  color: var(--p-brand-white);
  text-wrap: pretty;
}

.site-footer__acts {
  flex: 0 1 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.site-footer__act {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding: 17px 34px;
  border-radius: 0;
  font-family: var(--font-nav), system-ui, sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
}

.site-footer__act--solid {
  background: var(--em-text-on-inverse);
  color: var(--p-night-800);
  border: 1px solid var(--em-text-on-inverse);
  transition: opacity 0.3s ease;
}

.site-footer__act--solid:hover {
  opacity: 0.85;
}

.site-footer__act--ghost {
  background: transparent;
  color: var(--ft-ink);
  border: 1px solid rgba(var(--em-rgb-on-inverse), 0.45);
  transition: background 0.3s ease;
}

.site-footer__act--ghost:hover {
  background: rgba(128, 128, 128, 0.14);
}

.site-footer__act svg {
  flex: none;
  width: 14px;
  height: 14px;
}

@media (max-width: 899px) {
.site-footer__top {
    align-items: flex-start;
  }

.site-footer__acts {
    width: 100%;
  }

.site-footer__act {
    flex: 1 1 12rem;
    justify-content: center;
    padding: 15px 20px;
  }
}

.site-footer__heading {
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: 0.26em;
  color: var(--em-text-eyebrow-neutral-on-inverse);
}

.site-footer__list a,
.site-footer__list button {
  font-size: 15px;
  line-height: 1.5;
  color: rgba(var(--em-rgb-on-inverse), 0.78);
  transition:
    transform 0.4s var(--em-ease-soft),
    color 0.3s ease,
    opacity 0.2s ease;
}

.site-footer__list a:hover,
.site-footer__list button:hover {
  opacity: 1;
  color: var(--ft-ink);
  transform: translateX(5px);
}

.site-footer__lede {
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--p-brand-white);
}

.site-footer__submit,
.site-search-panel__close,
.field-tray__done,
.converse__cta,
.banner-search__compact,
.banner-search__filter,
.banner-search__submit,
.site-header__cta,
.site-search-btn {
  border-radius: 0 !important;
}

.site-footer .site-footer__grid {
  display: flex;
  flex-wrap: wrap;
  grid-template-columns: none;
  border-top: 0;
  border-bottom: 1px solid rgba(var(--em-rgb-on-inverse), 0.14);
}

.site-footer .site-footer__col {
  box-sizing: border-box;
  flex: 1 1 230px;
  min-width: 150px;
  padding: clamp(26px, 5.2vw, 72px) clamp(20px, 4vw, 60px);
  border-right: 1px solid rgba(var(--em-rgb-on-inverse), 0.12);
  border-bottom: 0;
  border-left: 0;
  border-top: 0;
}

.site-footer .site-footer__col--news {
  flex: 1 1 300px;
  min-width: 240px;
  padding: clamp(26px, 5.2vw, 72px) clamp(20px, 4vw, 60px);
  border-right: 0;
}

.site-footer .site-footer__col--follow {
  display: none;
}

.site-footer .site-footer__heading {
  margin: 0 0 16px;
}

.site-footer .site-footer__col--news .site-footer__heading {
  margin-bottom: 16px;
}

.site-footer .site-footer__list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 11px;
}

.site-footer .site-footer__list a,
.site-footer .site-footer__list button {
  padding: 0;
  line-height: 1.4;
}

.site-footer .site-footer__lede {
  margin: 0;
  max-width: 24em;
}

.site-footer .site-footer__form {
  display: flex;
  align-items: center;
  gap: 0;
  grid-template-columns: none;
  margin-top: 20px;
  padding-bottom: 0;
  border-bottom: 1px solid rgba(var(--em-rgb-on-inverse), 0.35);
}

.site-footer .site-footer__field {
  flex: 1 1 0;
  min-width: 0;
}

.site-footer .site-footer__field input {
  padding: 11px 2px;
  font-size: 15px;
  min-height: 0;
}

.site-footer .site-footer__submit {
  flex: none;
  min-height: 0;
  padding: 11px 2px 11px 14px;
  font-size: 10px;
  letter-spacing: 0.2em;
}

.site-footer .site-footer__social {
  align-items: center;
  gap: 14px;
  margin-top: 28px;
}

.site-footer .site-footer__social a {
  width: 40px;
  height: 40px;
  border: 1px solid rgba(var(--em-rgb-on-inverse), 0.22);
  background: rgba(var(--em-rgb-on-inverse), 0.03);
  color: rgba(var(--em-rgb-on-inverse), 0.75);
  transition:
    transform 0.45s var(--em-ease-soft),
    background 0.45s var(--em-ease-soft),
    border-color 0.45s var(--em-ease-soft),
    color 0.3s ease,
    box-shadow 0.45s var(--em-ease-soft);
}

.site-footer .site-footer__social a:hover {
  opacity: 1;
  transform: translateY(-3px) scale(1.05);
  background: var(--em-text-on-inverse);
  border-color: var(--em-text-on-inverse);
  color: var(--p-night-800);
  box-shadow: 0 14px 28px -10px rgba(var(--em-rgb-on-inverse), 0.4);
}

.site-footer .site-footer__social svg {
  width: 15px;
  height: 15px;
}

.site-footer .site-footer__bar {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 16px 30px;
  padding-inline: clamp(22px, 5vw, 88px);
  border-top: 0;
}

.site-footer .site-footer__explore-all {
  position: relative;
  gap: 12px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2em;
}

.site-footer .site-footer__explore-all span {
  margin-left: 0;
}

.site-footer .site-footer__explore-all::after {
  content: "";
  position: absolute;
  left: 0;
  right: 16px;
  top: calc(50% + 13.5px);
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.5s var(--em-ease-soft);
}

.site-footer .site-footer__explore-all:hover {
  opacity: 1;
}

.site-footer .site-footer__explore-all:hover::after,
.site-footer .site-footer__explore-all:focus-visible::after {
  transform: scaleX(1);
}

.site-footer .site-footer__copy {
  margin: 0 0 0 auto;
  font-size: 12.5px;
  color: var(--em-text-nontext);
}

.site-footer .site-footer__legal {
  justify-content: flex-start;
  gap: 16px 22px;
  font-size: 12.5px;
}

.site-footer .site-footer__legal a,
.site-footer .site-footer__prefs {
  font-size: 12.5px;
  color: rgba(var(--em-rgb-on-inverse), 0.6);
}

.site-footer .site-footer__legal a:hover,
.site-footer .site-footer__prefs:hover {
  color: var(--ft-ink);
  opacity: 1;
}

.site-footer .site-footer__replay {
  gap: 8px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.16em;
  color: var(--em-text-nontext);
}

.site-footer .site-footer__replay:hover {
  color: var(--ft-ink);
  opacity: 1;
}

@media (min-width: 1024px) {
.site-footer .site-footer__bar {
    padding-block: clamp(22px, 3.4vw, 44px);
  }
}

@media (max-width: 619px) {
.site-footer .site-footer__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

.site-footer .site-footer__col {
    flex-basis: auto;
    min-width: 0;
    padding: 24px 18px;
    border-right: 0;
  }

.site-footer .site-footer__col:nth-child(2n) {
    border-left: 1px solid rgba(var(--em-rgb-on-inverse), 0.12);
  }

.site-footer .site-footer__col:nth-child(n + 3) {
    border-top: 1px solid rgba(var(--em-rgb-on-inverse), 0.12);
  }

.site-footer .site-footer__col--follow {
    display: block;
  }

.site-footer .site-footer__col--follow .site-footer__social {
    gap: 12px;
    margin-top: 0;
  }

.site-footer .site-footer__col--news {
    grid-column: 1 / -1;
    padding: 26px 18px 30px;
    border-top: 1px solid rgba(var(--em-rgb-on-inverse), 0.12);
  }

.site-footer .site-footer__col--news .site-footer__social {
    display: none;
  }
}

@media (max-width: 1023px) {
.site-footer .site-footer__list {
    gap: 0;
  }

.site-footer .site-footer__list a,
  .site-footer .site-footer__list button {
    padding-block: 0.72rem;
  }

.site-footer .site-footer__social a,
  .site-footer .site-footer__col--follow .site-footer__social a {
    width: 44px;
    height: 44px;
  }

.site-footer .site-footer__field input,
  .site-footer .site-footer__submit,
  .site-footer .site-footer__legal a,
  .site-footer .site-footer__prefs,
  .site-footer .site-footer__replay,
  .site-footer .site-footer__explore-all {
    min-height: var(--em-control-min);
  }

.site-footer .site-footer__bar {
    padding-block: 26px;
    padding-bottom: 5.5rem;
  }

.mobile-more .site-footer .site-footer__bar {
    padding-bottom: 1.5rem;
  }
}

@media (min-width: 1024px) {
.site-footer .site-footer__explore-all,
  .site-footer .site-footer__legal a,
  .site-footer .site-footer__replay {
    min-height: 0;
    min-width: 0;
  }
}

.site-footer .site-footer__field input,
.site-footer .site-footer__submit {
  line-height: 1.4;
}

.site-footer .site-footer__col--news .site-footer__social a {
  width: 42px;
  height: 42px;
}

.site-footer .site-footer__explore-all,
.site-footer .site-footer__copy,
.site-footer .site-footer__legal,
.site-footer .site-footer__legal a,
.site-footer .site-footer__prefs,
.site-footer .site-footer__replay {
  line-height: normal;
}

button:where(
    .site-header__cta,
    .site-header__wa,
    .site-footer__act,
    .mobile-dock__item,
    .launch-scroll__cta,
    .site-footer__list button,
    .mobile-more__links button
  ) {
  font: inherit;
  color: inherit;
  text-align: inherit;
  cursor: pointer;
}

button:where(
    .site-header__wa,
    .mobile-dock__item,
    .site-footer__list button,
    .mobile-more__links button
  ) {
  border: 0;
  background: transparent;
  padding: 0;
}

.site-footer .site-footer__heading {
  font-family: var(--font-sans), "Segoe UI", system-ui, sans-serif;
  font-weight: 600;
  text-transform: uppercase;
}

.site-footer .site-footer__col--follow .site-footer__social svg {
  width: 17px;
  height: 17px;
}

.site-footer button.site-footer__explore-all {
  background: transparent;
  border: 0;
  padding: 0;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.site-footer__prefs {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
}

/* ———————————— Target sizes in the footer ————————————

   Found by audit on the launches pages and reproduced on every page that
   carries this footer: the five social links render 42x42 and the two legal
   links 38x18 and 32x18, all under the 44px floor the rest of this build
   holds. The social link takes the two pixels directly. The legal links must
   not gain 26px of height — they sit on one baseline with the copyright — so
   they grow their HIT AREA instead, with an inset pseudo-element, exactly as
   .em-card__name does in places.css. Layout is unchanged; only the box that
   answers a tap moves. */

/* The existing rules are written as `.site-footer .site-footer__social a`
   (0,2,1). A plainer selector here would be (0,1,1) and lose silently — which
   is how the first attempt at this fix computed min-width: 0px. Matched, and
   later in the file, so it wins. */
.site-footer .site-footer__social a,
/* the news column's copy of the list is written one class deeper again
   (0,3,1), so it has to be named or it keeps its 42px */
.site-footer .site-footer__col--news .site-footer__social a,
.site-footer .site-footer__col--follow .site-footer__social a {
  width: 44px;
  height: 44px;
}
.site-footer .site-footer__legal a {
  position: relative;
}
.site-footer .site-footer__legal a::after {
  content: '';
  position: absolute;
  /* the text box is 18px tall, so 13px of reach above and below makes 44 */
  inset: -13px -7px;
}