/* ccx-mobnav - the navigation on narrow windows, and the foot of the page
 * there.
 *
 * Everything in this file lives inside a width query. Above 1024 pixels the
 * wide bar is on screen, this file matches nothing, and the two modules that
 * own the wide bar (ccx-header, ccx-nav26) are untouched by it.
 *
 * The two hooks are element ids that both header templates share, 8a4ef1d
 * for the burger and db31fc2 for the bar it sits in, so the English and the
 * German header are carried by the same rules. Nothing here names a menu
 * entry, so the menus can be rebuilt without this file having to know.
 *
 * WHY SO MANY !important
 *
 * The nested menu widget writes its own geometry from custom properties into
 * a rule of the same weight as anything written here, and Elementor puts two
 * of the numbers that matter, the stretch offsets and the height cap of the
 * panel, into the style attribute of the panel itself. A declaration in a
 * stylesheet cannot outweigh a style attribute at all, so those are marked.
 * Where a plain selector is enough it is left plain.
 */

/* ======================================================================
 * 1. THE SHEET
 *
 * Elementor hangs the panel under the burger as an absolutely placed box
 * with a height cap of 800 pixels, as wide as the window through the two
 * stretch offsets it writes inline. Measured at 390: it began 60 pixels
 * down, was 569 tall, and the page went on below it.
 *
 * It is fixed to the window now and reaches the bottom of it. --ccmn-top is
 * the lower edge of the bar, written by the script on every open and on
 * every resize; the fallback of 70 pixels is the height the bar has on a
 * phone, so the sheet sits right even with the script removed.
 *
 * The panel has no ancestor with a transform, a filter or paint containment
 * (checked in the running page, not assumed), so fixed really is measured
 * against the window here.
 * ==================================================================== */

@media (max-width: 1024px) {

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-wrapper {
    --ccmn-row: 56px;
    --ccmn-pad: 20px;
    --ccmn-line: rgb(45, 52, 76);
    --ccmn-text: #d7dce8;
    --ccmn-muted: rgba(215, 220, 232, .66);
    --ccmn-accent: #ff8e2b;

    position: fixed !important;
    top: var(--ccmn-top, 70px) !important;
    left: 0 !important;
    right: var(--ccmn-sbw, 0px) !important;
    bottom: 0 !important;
    width: auto !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;
    /* Stops a flick that reaches the end of the sheet from carrying on into
       the article behind it. The lock in the script is the other half of
       this; either one alone leaves a gap on one platform or the other. */
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;

    /* The ground. The rows carry the page navy themselves, this is what
       shows below the last one, and the hairline is the seam with the bar. */
    background-color: #0b1227;
    background-image: linear-gradient(180deg, #0b1227 0%, #0b1227 62%, #0d1530 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 24px 60px -30px rgba(0, 0, 0, .9);

    padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* The list of entries. It arrives as a wrapping row, which is what put the
     six entries under each other by accident rather than on purpose. */
  header.elementor-location-header .elementor-element-8a4ef1d ul.e-n-menu-heading {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 100% !important;
    gap: 0 !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d li.e-n-menu-item {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
  }

  /* ====================================================================
   * 2. ONE ROW PER ENTRY
   *
   * Before: 95 pixels tall, label centred, 30 above and 28 below it, and a
   * hairline drawn edge to edge. The tap area was the label.
   *
   * Now: the row is the tap area. The label sits on the left inside it and
   * grows to fill everything the chevron does not need, so a thumb that
   * lands anywhere on the line hits the link. The hairline is drawn as a
   * background image inset by the row padding, which reads as a list; the
   * border it replaces is switched off rather than fought with.
   * ================================================================== */

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-title {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-height: var(--ccmn-row) !important;
    padding: 0 var(--ccmn-pad) !important;
    border: 0 !important;
    background-color: transparent !important;
    background-image: linear-gradient(rgb(45, 52, 76), rgb(45, 52, 76)) !important;
    background-repeat: no-repeat !important;
    background-position: var(--ccmn-pad) 100% !important;
    background-size: calc(100% - var(--ccmn-pad) * 2) 1px !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d li.e-n-menu-item:last-child .e-n-menu-title {
    background-image: none !important;
  }

  /* The label. Flex 1 so the whole line answers, left aligned, and tall
     enough on its own that it clears the 44 pixel mark even if a future row
     loses its padding. */
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-title-container {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    min-height: var(--ccmn-row) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    padding: 0 !important;
    -webkit-tap-highlight-color: transparent;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-title-text {
    font-size: 19px !important;
    line-height: 24px !important;
    font-weight: 600 !important;
    letter-spacing: .002em;
    text-align: left !important;
  }

  /* The chevron. It was 24 by 36 pixels with five pixels of air on its left,
     sitting next to a centred label; the two together were one small target
     in the middle of a wide empty row. It is a 48 pixel square at the right
     end now, pulled out into the row padding so the glyph stays optically on
     the edge, and it is the only part of the row that opens the drop-down. */
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-dropdown-icon {
    flex: 0 0 auto !important;
    width: 48px !important;
    height: 48px !important;
    margin: 0 -12px 0 8px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px;
    -webkit-tap-highlight-color: transparent;
    transition: background-color .16s ease-out;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-dropdown-icon:active {
    background-color: rgba(255, 255, 255, .06);
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-dropdown-icon svg {
    width: 13px;
    height: 13px;
  }

  /* Pressed state for the row itself. Written for touch, not for hover:
     on the screens that show this sheet no pointer rests anywhere. */
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-title-container:active {
    background-color: rgba(255, 255, 255, .05);
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-title-container:focus-visible,
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-dropdown-icon:focus-visible {
    outline: 2px solid #ffb765;
    outline-offset: -2px;
    border-radius: 10px;
  }

  /* ====================================================================
   * 3. THE TWO DROP-DOWNS
   *
   * Both arrive as a centred wrapping row of 14 pixel links, three to a
   * line. They are lists now, indented behind a thin warm rail so the
   * nesting is visible without a second colour or a box.
   * ================================================================== */

  /* The panel arrives at the width the wide bar gives it, 216 pixels of the
     390 the sheet has, with 15 pixels of side padding on the box inside it
     and a 36 pixel gap between its rows. All three are numbers for a card
     hanging under a wide menu. Here the panel is the full width of the
     sheet and the rows sit on each other; the padding that the entries
     themselves need is written back on further down. */
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content,
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content > .e-con {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content > .e-con {
    background-color: rgba(255, 255, 255, .022) !important;
    border: 0 !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .e-con {
    padding: 0 !important;
    row-gap: 0 !important;
    column-gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .e-con-inner {
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .elementor-widget-nav-menu {
    padding: 6px 0 10px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* The 20 pixels Elementor puts between two widgets of a container are a
     figure for a page, not for a list: they turned two 44 pixel link rows
     into two rows 64 pixels apart. Taken out here, and the air the panel
     needs is put back on the three labels further down, where it can be
     read off one number instead of two. */
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .e-con > .elementor-widget {
    margin-block-end: 0 !important;
    margin-bottom: 0 !important;
  }

  /* The 40 pixels sit on the box inside the widget, not on the widget, which
     is why zeroing the widget alone left the panel at its old height. */
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .elementor-widget > .elementor-widget-container {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Every line in the panel is a paragraph, and a paragraph carries the
     theme's closing margin of 20 pixels. On a page that is a rhythm; in a
     list of six lines it is 120 pixels of nothing. The three labels put
     their own air back a few rules below. */
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .elementor-heading-title {
    margin: 0 !important;
  }

  /* The underline the theme draws under the entry a visitor is standing on
     was a short mark under a centred label. On a full width row it becomes a
     rule across the screen, and the colour already says which entry it is. */
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content a.elementor-item::before,
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content a.elementor-item::after {
    display: none !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .elementor-nav-menu--main > ul.elementor-nav-menu {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    margin: 0 0 0 var(--ccmn-pad) !important;
    padding-left: 14px !important;
    border-left: 2px solid rgba(255, 142, 43, .3) !important;
    row-gap: 0 !important;
    column-gap: 0 !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .elementor-nav-menu--main ul.elementor-nav-menu > li {
    width: 100% !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .elementor-nav-menu--main ul.elementor-nav-menu a.elementor-item {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 44px !important;
    /* The side margins the horizontal layout gives every link are dropped:
       the first link has only the right one, which left it standing 18
       pixels to the left of all the others in a column. */
    margin: 0 !important;
    padding: 0 var(--ccmn-pad) 0 14px !important;
    font-size: 15px !important;
    line-height: 20px !important;
    font-weight: 500 !important;
    text-align: left !important;
    -webkit-tap-highlight-color: transparent;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .elementor-nav-menu--main ul.elementor-nav-menu a.elementor-item:active {
    color: var(--ccmn-accent) !important;
  }

  /* The second copy of every menu, the one Elementor keeps for its own
     collapsed layout, is switched off in the widget settings and hidden from
     assistive technology. Stated here as well so a settings change cannot
     put two lists on the screen. */
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .elementor-nav-menu--dropdown {
    display: none !important;
  }

  /* ====================================================================
   * 4. THE APP PANEL INSIDE THE SERVICES DROP-DOWN
   *
   * English header only; the German one never had it filled. It is the
   * tallest thing in the sheet, 1018 pixels at 390, because it is the
   * desktop mega panel with its full column layout. The parts stay, they
   * are laid out as a list: label, sentence, two links, three app rows of
   * icon and text.
   * ================================================================== */

  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-ee9a8e1 > .e-con-inner {
    padding: 18px var(--ccmn-pad) 22px !important;
    gap: 0 !important;
  }

  /* The heading of the panel says SHOPIFY APPS twice, once as an eyebrow and
     once as the heading. On a phone that is two identical lines above each
     other; the eyebrow goes and the heading takes the eyebrow's size. */
  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-77aa2e1 {
    display: none !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-219b278 .elementor-heading-title {
    font-size: 12px !important;
    line-height: 16px !important;
    font-weight: 700 !important;
    letter-spacing: .09em !important;
    color: var(--ccmn-accent) !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-2c6740f .elementor-heading-title {
    font-size: 13px !important;
    line-height: 19px !important;
    color: var(--ccmn-muted) !important;
    margin-top: 6px !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-172d5e3 .elementor-heading-title,
  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-821bd45 .elementor-heading-title {
    font-size: 11px !important;
    line-height: 16px !important;
    font-weight: 700 !important;
    letter-spacing: .1em !important;
    color: rgba(215, 220, 232, .5) !important;
    margin-top: 20px !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-b61c6d1 .elementor-heading-title,
  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-1c74d97 .elementor-heading-title {
    display: flex !important;
    align-items: center !important;
    min-height: 44px !important;
    font-size: 15px !important;
    line-height: 20px !important;
  }

  /* The three app entries. Each is a link containing an icon and two
     headings, in that order, so the grid is written against the order and
     not against three lists of element ids. */
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-content .elementor-element-ae8fbf3.e-con {
    row-gap: 10px !important;
    margin-top: 10px !important;
  }

  /* Each entry keeps the frame it already wears; only the way the three
     parts inside it are placed changes, from a column that is as tall as
     its picture to a row of icon and text. Written against the order of
     the children instead of three lists of element ids. */
  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-ae8fbf3 > a.e-con {
    display: grid !important;
    grid-template-columns: 40px 1fr;
    column-gap: 12px !important;
    row-gap: 2px !important;
    align-items: center;
    min-height: 64px;
    padding: 12px 14px !important;
    -webkit-tap-highlight-color: transparent;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-ae8fbf3 > a.e-con > :nth-child(1) {
    grid-column: 1;
    grid-row: 1 / span 2;
    width: 40px !important;
    max-width: 40px !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-ae8fbf3 > a.e-con > :nth-child(1) svg,
  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-ae8fbf3 > a.e-con > :nth-child(1) img {
    width: 40px !important;
    height: 40px !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-ae8fbf3 > a.e-con > :nth-child(2) {
    grid-column: 2;
    grid-row: 1;
    width: auto !important;
    max-width: none !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-ae8fbf3 > a.e-con > :nth-child(2) .elementor-heading-title {
    font-size: 15px !important;
    line-height: 20px !important;
    font-weight: 600 !important;
    color: var(--ccmn-text) !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-ae8fbf3 > a.e-con > :nth-child(3) {
    grid-column: 2;
    grid-row: 2;
    width: auto !important;
    max-width: none !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .elementor-element-ae8fbf3 > a.e-con > :nth-child(3) .elementor-heading-title {
    font-size: 12.5px !important;
    line-height: 17px !important;
    color: var(--ccmn-muted) !important;
    /* Two lines is what the shortest of the three sentences needs; the
       longer two are cut there rather than pushing the row to 96 pixels. */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* ====================================================================
   * 5. THE CONTACT BUTTON
   *
   * The wide bar has one, the narrow bar never did, and below 768 pixels the
   * standing bar of ccx-mobilecta is the only place a visitor is offered a
   * way to write. Between 768 and 1024 there was none at all.
   *
   * The look is taken from that standing bar rather than invented: the same
   * pair of oranges, the same pale rim, the same radius and weight. The
   * script puts the element at the end of the sheet.
   * ================================================================== */

  /* The block sits at the foot of the sheet, not right under the last
     entry: the list is 336 pixels of a 774 pixel sheet on a phone, so
     anchored it lands in the easiest part of the screen for a thumb and the
     empty ground reads as spacing rather than as a stop. Where the list is
     longer than the sheet, because a drop-down is open, auto is nothing and
     the block simply follows the last row. */
  header.elementor-location-header .elementor-element-8a4ef1d .ccmn-foot {
    margin-top: auto;
    padding: 18px var(--ccmn-pad) calc(6px + var(--ccmn-revisit, 0px));
    border-top: 1px solid rgba(45, 52, 76, .75);
  }

  header.elementor-location-header .elementor-element-8a4ef1d p.ccmn-status {
    display: flex;
    align-items: center;
    margin: 0 0 12px;
    padding: 0;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: var(--ccmn-muted);
  }

  /* The same green and the same beat as the standing bar and the
     availability card, written again here because those two styles are
     scoped to their own elements. */
  header.elementor-location-header .elementor-element-8a4ef1d .ccmn-dot {
    position: relative;
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    margin-right: 8px;
    border-radius: 50%;
    background: #34D399;
    box-shadow: 0 0 8px rgba(52, 211, 153, .75);
    animation: ccmn-pulse 2.4s ease-in-out infinite;
  }

  @keyframes ccmn-pulse {
    0%, 100% { opacity: .72; box-shadow: 0 0 5px rgba(52, 211, 153, .45); }
    50%      { opacity: 1;   box-shadow: 0 0 9px rgba(52, 211, 153, .85); }
  }

  header.elementor-location-header .elementor-element-8a4ef1d a.ccmn-cta-main {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 50px;
    border-radius: 999px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    color: rgba(255, 255, 255, .97);
    background: linear-gradient(180deg, #FF8E2B 0%, #CE5904 100%);
    box-shadow: inset 0 1px 0 rgba(255, 183, 101, .55), 0 6px 18px rgba(206, 89, 4, .28);
    -webkit-tap-highlight-color: transparent;
    transition: filter .18s ease-out;
  }

  header.elementor-location-header .elementor-element-8a4ef1d a.ccmn-cta-main:active { filter: brightness(1.08); }

  header.elementor-location-header .elementor-element-8a4ef1d a.ccmn-cta-main:focus-visible {
    outline: 2px solid #ffb765;
    outline-offset: 2px;
  }

  /* ====================================================================
   * 6. THE PAGE BEHIND THE SHEET
   *
   * Held still while the sheet is open. --ccmn-sbw is the width a classic
   * scrollbar leaves behind when it goes, measured by the script; on a touch
   * screen it is zero and none of this is felt.
   * ================================================================== */

  html.ccx-mobnav-open,
  html.ccx-mobnav-open body {
    overflow: hidden !important;
  }

  html.ccx-mobnav-open body {
    padding-right: var(--ccmn-sbw, 0px);
  }

  /* The standing call to action would sit under the sheet with a second
     orange button on it. It steps aside for as long as the sheet is open.
     The rule lives here because it is this sheet that causes it; the module
     that owns that bar is not touched. */
  html.ccx-mobnav-open .ccx-mobcta {
    display: none !important;
  }

  /* That bar publishes its height as --ccx-mobcta-lift, and the consent
     tool's round button rides on it. While the bar is away the height is
     zero, and saying so lets the button drop back to its own corner instead
     of floating where a hidden bar used to be. */
  html.ccx-mobnav-open body {
    /* Marked, because that module writes the value into the style attribute
       of the body and nothing in a stylesheet outweighs that otherwise. */
    --ccx-mobcta-lift: 0px !important;
  }

  /* ====================================================================
   * 7. THE WAY IN
   * ================================================================== */

  /* Elementor's own hide-scroll keeps the scrollbar of the panel out of the
     first 300ms of an opening, and naming a new animation would have taken
     it off; both are declared, so the sheet fades in and the bar still does
     not flash. */
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-wrapper {
    animation: ccmn-sheet-in .2s cubic-bezier(.22, .61, .36, 1) both, hide-scroll .3s backwards;
  }

  @keyframes ccmn-sheet-in {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
  }
}

/* Tablets get a little more room per row and a slightly larger label; the
   sheet is the same shape. */
@media (min-width: 768px) and (max-width: 1024px) {
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-wrapper {
    --ccmn-row: 62px;
    --ccmn-pad: 28px;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-title-text {
    font-size: 21px !important;
    line-height: 28px !important;
  }

  header.elementor-location-header .elementor-element-8a4ef1d .ccmn-foot {
    padding-left: 28px;
    padding-right: 28px;
  }

  /* A pill the full width of a tablet is a slab of orange. It keeps the
     width of the wide bar's own call to action instead, left aligned with
     the list above it. */
  header.elementor-location-header .elementor-element-8a4ef1d a.ccmn-cta-main {
    width: fit-content;
    min-width: 300px;
    padding: 0 26px;
  }
}

/* ======================================================================
 * 8. THE FOOT OF THE PAGE ON NARROW WINDOWS
 *
 * The columns already stack. What they stack are rows of 22 pixels with 4
 * between them, so the list of links reads as a paragraph and every one of
 * the thirteen links is under the mark a thumb needs. They keep their type
 * and their order, they just stand 44 pixels apart from the middle of one
 * line to the middle of the next.
 * ==================================================================== */

@media (max-width: 1024px) {

  footer.elementor-location-footer .elementor-widget-icon-list .elementor-icon-list-item {
    margin-bottom: 0 !important;
  }

  footer.elementor-location-footer .elementor-widget-icon-list .elementor-icon-list-item > a,
  footer.elementor-location-footer .elementor-widget-icon-list .elementor-icon-list-item > span {
    display: flex !important;
    align-items: center !important;
    min-height: 44px !important;
    padding: 0 !important;
    -webkit-tap-highlight-color: transparent;
  }

  footer.elementor-location-footer .elementor-widget-icon-list .elementor-icon-list-item > a:active {
    color: #ff8e2b !important;
  }

  footer.elementor-location-footer .elementor-widget-icon-list .elementor-icon-list-item > a:focus-visible {
    outline: 2px solid #ffb765;
    outline-offset: 2px;
    border-radius: 6px;
  }

  /* The closing row. Its legal links are an inline list, so they get the
     same tap height without leaving their line, and the line of copyright
     below them steps back in size and colour: it is the quietest thing on
     the page and was set larger than the links above it. */
  footer.elementor-location-footer .elementor-element-a1e8bae .elementor-icon-list-item > a {
    min-height: 44px !important;
    padding: 0 !important;
  }

  footer.elementor-location-footer .elementor-element-c44d96e .elementor-heading-title {
    font-size: 13px !important;
    line-height: 20px !important;
    color: rgba(215, 220, 232, .55) !important;
  }

  /* The closing row already carries a separator of its own, a divider widget
     right at its top edge, so it gets air above it and nothing else. A
     second line was drawn here at first and read as a double rule. */
  footer.elementor-location-footer .elementor-element-a1a67fc {
    margin-top: 10px !important;
  }
}

@media (max-width: 767px) {
  /* Stacked, the two halves of the closing row need air between them and a
     shared middle, which is where the copyright already sits. */
  footer.elementor-location-footer .elementor-element-a1e8bae .elementor-icon-list-items {
    justify-content: center !important;
    row-gap: 0 !important;
  }

  footer.elementor-location-footer .elementor-element-a1e8bae .elementor-icon-list-item > a {
    padding: 0 10px !important;
  }
}

/* ======================================================================
 * 9. LESS MOVEMENT
 * ==================================================================== */

@media (prefers-reduced-motion: reduce) {
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-wrapper {
    animation: hide-scroll .3s backwards;
  }
  header.elementor-location-header .elementor-element-8a4ef1d .e-n-menu-dropdown-icon,
  header.elementor-location-header .elementor-element-8a4ef1d a.ccmn-cta-main {
    transition: none;
  }
  header.elementor-location-header .elementor-element-8a4ef1d .ccmn-dot {
    animation: none;
    opacity: 1;
  }
}