@import url("https://fonts.googleapis.com/css2?family=Assistant:wght@400;500;600;700&family=Frank+Ruhl+Libre:wght@400;500;700&family=IBM+Plex+Mono:wght@400;500&display=swap");

/* ============================================================================
   Masthead — Top Navigation layout
   ----------------------------------------------------------------------------
   A light editorial header: paper ground, a serif wordmark, hairline rules, an
   underline that wipes in from the leading edge, and a wide mega panel that
   sets its links in columns like a printed index.

   Written against the class vocabulary _TopMenuNav renders (.wsmenu,
   .wsmenu-list, .sub-menu, .wsmegamenu/.megacollink, .desktoplogo,
   .wsmobileheader, .wsanimated-arrow, .overlapblackbg, .wsmenu-click) and
   against the behaviour webslidemenu.js provides.

   The folder ships a `standalone` marker, so this is the ONLY stylesheet
   _TopMenuNav loads for it: no vendor geometry patch, no per-template theme
   bridge, no RTL mirror layer. Authored with logical properties throughout, so
   it is correct in both directions with no second pass.
   ========================================================================== */

.wsmainfull,
.wsmobileheader,
.headtoppart {
  --paper:    #EEF0E6;
  --panel:    #F7F8F2;
  --ink:      #16231C;
  --ink-soft: #526055;
  --line:     #C9D0BE;
  /* The site's own accent wins where a theme defines one; chicory blue is the
     fallback identity. */
  --accent:   var(--header-accent, var(--wc-accent, #2C48A8));
  --bar-h:    68px;
  --mh:       58px;  /* mobile header height — the drawer starts below it */

  --font:     Assistant, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-d:   "Frank Ruhl Libre", Georgia, "Times New Roman", serif;
  --font-m:   "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* ══════════════════════════════════════════════════════════════════════════
   NOTICE STRIP  (phone / socials — .headtoppart)
   --------------------------------------------------------------------------
   The comp runs its notice under the bar; _TopMenuNav renders this block
   before .wsmainfull, so here it sits above it. Same role, same hatched
   ground — and it only renders at all when a phone number or social link is
   set in Admin → Settings.
   ══════════════════════════════════════════════════════════════════════════ */
.headtoppart {
  background: var(--paper);
  background-image: repeating-linear-gradient(225deg, transparent 0 6px, rgba(22, 35, 28, .035) 6px 7px);
  border-bottom: 1px solid var(--line);
  font-family: var(--font);
}
.headtoppart .headerwp {
  max-width: 1240px;
  margin: 0 auto;
  padding: 7px 24px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.headtoppart .headertopright { margin-inline-start: auto; display: flex; gap: 4px; }
.headtoppart a {
  color: var(--ink-soft);
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .01em;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 2px 4px;
}
.headtoppart .headertopleft a { font-family: var(--font-m); direction: ltr; }
.headtoppart .headertopright a { font-size: 15px; }
.headtoppart a:hover, .headtoppart a:focus-visible { color: var(--ink); }

/* ══════════════════════════════════════════════════════════════════════════
   THE BAR
   ══════════════════════════════════════════════════════════════════════════ */
.wsmainfull {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  font-family: var(--font);
  color: var(--ink);
}
.wsmainfull * { box-sizing: border-box; }
.wsmainwp {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  gap: 36px;
  min-height: var(--bar-h);
}

/* Wordmark — leads the bar, as in the comp. .desktoplogo already precedes
   .wsmenu in the markup and the flex row follows the inline axis, so this
   lands at the right in RTL and the left in LTR with no reordering. */
.desktoplogo { flex: 0 0 auto; display: flex; align-items: center; }
.desktoplogo a {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--ink);
  text-decoration: none;
  font-family: var(--font-d);
  font-weight: 700;
  font-size: 23px;
  letter-spacing: -.01em;
  line-height: 1;
  white-space: nowrap;
}
.desktoplogo img { display: block; max-height: 38px; width: auto; }

.wsmenu { flex: 1 1 auto; min-width: 0; }

/* ══════════════════════════════════════════════════════════════════════════
   DESKTOP  (≥ 992px — the breakpoint webslidemenu.js switches on)
   ══════════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 992px) {

  .wsmobileheader { display: none; }
  .overlapblackbg { display: none; }
  .wsmenu-click   { display: none; }

  .wsmenu > .wsmenu-list {
    display: flex;
    align-items: stretch;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 4px;
  }
  .wsmenu > .wsmenu-list > li { position: relative; }

  /* ── Trigger ─────────────────────────────────────────────────────────── */
  .wsmenu > .wsmenu-list > li > a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    height: var(--bar-h);
    padding: 0 12px;
    font-size: 16px;
    font-weight: 600;
    color: var(--ink);
    text-decoration: none;
    white-space: nowrap;
  }
  /* Rule that wipes in from the leading edge. transform-origin is physical, so
     it is the one thing here that has to name a side — keyed off the dir
     _TopMenuNav puts on <nav class="wsmenu">. */
  .wsmenu > .wsmenu-list > li > a:after {
    content: "";
    position: absolute;
    inset-inline: 12px;
    bottom: 0;
    height: 2px;
    background: var(--ink);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .22s ease;
  }
  .wsmenu[dir="rtl"] > .wsmenu-list > li > a:after { transform-origin: right; }
  .wsmenu > .wsmenu-list > li > a:hover:after,
  .wsmenu > .wsmenu-list > li > a:focus-visible:after,
  .wsmenu > .wsmenu-list > li:hover > a:after,
  .wsmenu > .wsmenu-list > li:focus-within > a:after { transform: scaleX(1); }
  /* Current page keeps its rule in the accent even when another item is hovered. */
  .wsmenu > .wsmenu-list > li > a.active:after { transform: scaleX(1); background: var(--accent); }

  /* Caret — a chevron rather than the vendor's solid triangle, rotating when
     the panel is open. Drawn from two borders so it needs no icon font. The
     border pair is deliberately physical: rotate() turns the box the same way
     whatever the direction, so logical borders drew it pointing sideways in
     RTL. */
  .wsmenu > .wsmenu-list > li > a .wsarrow { display: inline-flex; }
  .wsmenu > .wsmenu-list > li > a .wsarrow:after {
    content: "";
    width: 6px;
    height: 6px;
    border-right: 1.6px solid var(--ink-soft);
    border-bottom: 1.6px solid var(--ink-soft);
    transform: rotate(45deg);
    margin-block-start: -3px;
    transition: transform .22s ease;
  }
  .wsmenu > .wsmenu-list > li:hover > a .wsarrow:after,
  .wsmenu > .wsmenu-list > li:focus-within > a .wsarrow:after {
    transform: rotate(225deg);
    margin-block-start: 3px;
  }

  /* ── Panels ──────────────────────────────────────────────────────────── */
  .wsmenu > .wsmenu-list > li > ul.sub-menu,
  .wsmenu > .wsmenu-list > li > .wsmegamenu {
    position: absolute;
    top: 100%;
    inset-inline-start: -12px;   /* line the panel's text up with the trigger's */
    z-index: 1000;
    margin: 0;
    list-style: none;
    background: var(--panel);
    border: 1px solid var(--line);
    border-top: 0;
    box-shadow: 0 18px 40px -24px rgba(22, 35, 28, .45);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s;
  }
  /* The comp's stitched rule across the head of the panel. */
  .wsmenu > .wsmenu-list > li > ul.sub-menu:before,
  .wsmenu > .wsmenu-list > li > .wsmegamenu:before {
    content: "";
    position: absolute;
    inset-inline: 0;
    top: 8px;
    height: 1px;
    background: repeating-linear-gradient(90deg, var(--line) 0 4px, transparent 4px 9px);
  }
  .wsmenu > .wsmenu-list > li:hover > ul.sub-menu,
  .wsmenu > .wsmenu-list > li:focus-within > ul.sub-menu,
  .wsmenu > .wsmenu-list > li:hover > .wsmegamenu,
  .wsmenu > .wsmenu-list > li:focus-within > .wsmegamenu {
    opacity: 1;
    visibility: visible;
    transform: none;
  }

  /* Simple dropdown — one column, sized to its longest label. */
  .wsmenu > .wsmenu-list > li > ul.sub-menu {
    width: max-content;
    min-width: 240px;
    max-width: min(24rem, calc(100vw - 48px));
    padding: 22px 18px 16px;
  }
  .wsmenu .wsmenu-list li ul.sub-menu li { list-style: none; }
  .wsmenu .wsmenu-list li ul.sub-menu li > a {
    display: block;
    padding: 9px 10px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--ink);
    text-decoration: none;
    border-radius: 2px;
    transition: background-color .16s ease, color .16s ease;
  }
  .wsmenu .wsmenu-list li ul.sub-menu li > a:hover,
  .wsmenu .wsmenu-list li ul.sub-menu li > a:focus-visible {
    background: color-mix(in srgb, var(--accent) 8%, transparent);
  }
  .wsmenu .wsmenu-list li ul.sub-menu li > a.active { color: var(--accent); }

  /* Nested fly-out opens toward the inline-start, clear of its parent. */
  .wsmenu .wsmenu-list li ul.sub-menu li { position: relative; }
  .wsmenu .wsmenu-list li ul.sub-menu li ul.sub-menu {
    position: absolute;
    top: -14px;
    inset-inline-start: 100%;
    inset-inline-end: auto;
    border-top: 1px solid var(--line);
  }

  /* ── Mega: a printed index ───────────────────────────────────────────────
     One flat child list is all the CMS gives us, so the columns come from CSS
     multicol rather than from grouping — the links flow down one column and on
     to the next, which is how an index reads anyway.

     Column count and panel width step up with the size of the menu, so a
     four-item menu gets a slim panel instead of the comp's full-width slab.
     :has() is what counts the items; where it is unsupported the base rule
     stands and the panel is simply the one-column version. */
  .wsmenu > .wsmenu-list > li > .wsmegamenu {
    width: max-content;
    max-width: min(22rem, calc(100vw - 48px));
    padding: 24px 22px 18px;
  }
  .wsmenu > .wsmenu-list > li > .wsmegamenu:has(.megacollink li:nth-child(7)) {
    width: min(600px, calc(100vw - 48px));
    max-width: none;
  }
  .wsmenu > .wsmenu-list > li > .wsmegamenu:has(.megacollink li:nth-child(13)) {
    width: min(900px, calc(100vw - 48px));
  }
  .wsmenu > .wsmenu-list > li > .wsmegamenu .megacollink {
    list-style: none;
    margin: 0;
    padding: 0;
    column-gap: 30px;
    column-rule: 1px solid var(--line);
  }
  .wsmenu > .wsmenu-list > li > .wsmegamenu:has(.megacollink li:nth-child(7)) .megacollink  { columns: 2; }
  .wsmenu > .wsmenu-list > li > .wsmegamenu:has(.megacollink li:nth-child(13)) .megacollink { columns: 3; }
  .wsmenu > .wsmenu-list > li > .wsmegamenu .megacollink li {
    break-inside: avoid;
    list-style: none;
  }
  .wsmenu > .wsmenu-list > li > .wsmegamenu .megacollink li a {
    display: block;
    padding: 9px 10px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--ink);
    text-decoration: none;
    background: transparent;
    border-radius: 2px;
    transition: background-color .16s ease, color .16s ease;
  }
  .wsmenu > .wsmenu-list > li > .wsmegamenu .megacollink li a:hover,
  .wsmenu > .wsmenu-list > li > .wsmegamenu .megacollink li a:focus-visible {
    background: color-mix(in srgb, var(--accent) 8%, transparent);
  }
  .wsmenu > .wsmenu-list > li > .wsmegamenu .megacollink li a.active { color: var(--accent); }

  /* ── Optional header search (Admin → Settings) ───────────────────────── */
  .wsmenu > .wsmenu-list > li.rightmenu { margin-inline-start: auto; display: flex; align-items: center; }
  .topmenusearch { display: flex; align-items: center; }
  .topmenusearch input {
    width: 190px;
    height: 34px;
    padding: 0 10px;
    font: inherit;
    font-size: 15px;
    color: var(--ink);
    background: transparent;
    border: 1px solid var(--ink);
    border-radius: 2px;
  }
  .topmenusearch input::placeholder { color: var(--ink-soft); }
  .topmenusearch input:focus { outline: none; border-color: var(--accent); }
  .topmenusearch button, .topmenusearch .btnstyle {
    height: 34px;
    padding: 0 10px;
    color: var(--ink-soft);
    background: none;
    border: 0;
    cursor: pointer;
  }
  .topmenusearch button:hover { color: var(--ink); }
}

/* ══════════════════════════════════════════════════════════════════════════
   MOBILE  (≤ 991px)  —  off-canvas drawer
   --------------------------------------------------------------------------
   webslidemenu.js owns the behaviour: it toggles `wsactive` on <body>, injects
   .overlapblackbg into .wsmenu and a .wsmenu-click chevron into every item with
   children, then animates the panels open by writing inline display /
   max-height. So the panels start hidden here, and the drawer slides on
   margin-inline-start — a property the script does not touch, and one that
   enters from the correct side in either direction.
   ══════════════════════════════════════════════════════════════════════════ */
@media only screen and (max-width: 991px) {

  .headtoppart { display: none; }

  /* The desktop bar is stripped back rather than hidden: .wsmenu — which becomes
     the drawer — is a child of it, so `display: none` here would take the whole
     navigation with it. */
  .wsmainfull   { background: none; border: 0; }
  .wsmainwp     { display: block; max-width: none; margin: 0; padding: 0; min-height: 0; }
  .desktoplogo  { display: none; }

  .wsmobileheader {
    position: sticky;
    top: 0;
    z-index: 1060;   /* above the open drawer, so the X stays reachable */
    display: flex;
    align-items: center;
    gap: 12px;
    height: var(--mh);
    padding: 0 16px;
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    font-family: var(--font);
  }
  .wsmobileheader .smllogo {
    font-family: var(--font-d);
    font-weight: 700;
    font-size: 19px;
    color: var(--ink);
  }
  .wsmobileheader .smllogo img { display: block; max-height: 32px; width: auto; }
  .callusbtn {
    margin-inline-start: auto;
    color: var(--accent);
    font-size: 18px;
    text-decoration: none;
    padding: 8px;
  }

  /* Burger — three rules that fold into an X while the drawer is open. */
  .wsanimated-arrow {
    position: relative;
    width: 36px;
    height: 36px;
    flex: none;
    cursor: pointer;
    display: block;
    border: 1px solid var(--line);
    border-radius: 2px;
  }
  .wsanimated-arrow span,
  .wsanimated-arrow span:before,
  .wsanimated-arrow span:after {
    position: absolute;
    inset-inline-start: 8px;
    width: 18px;
    height: 1.5px;
    background: var(--ink);
    transition: transform .22s ease, background-color .22s ease;
  }
  .wsanimated-arrow span { top: 17px; }
  .wsanimated-arrow span:before { content: ""; top: -5.5px; inset-inline-start: 0; }
  .wsanimated-arrow span:after  { content: ""; top:  5.5px; inset-inline-start: 0; }
  .wsactive .wsanimated-arrow span { background: transparent; }
  .wsactive .wsanimated-arrow span:before { transform: translateY(5.5px) rotate(45deg); }
  .wsactive .wsanimated-arrow span:after  { transform: translateY(-5.5px) rotate(-45deg); }

  /* Drawer shell — covers the viewport only while open, so it never eats
     clicks on the page underneath. */
  .wsmenu {
    position: fixed;
    inset: 0;
    z-index: 1050;
    visibility: hidden;
    transition: visibility 0s .3s;
  }
  .wsactive .wsmenu { visibility: visible; transition-delay: 0s; }

  .overlapblackbg {
    position: absolute;
    inset: var(--mh) 0 0;
    background: rgba(22, 35, 28, .45);
    opacity: 0;
    transition: opacity .3s ease;
  }
  .wsactive .overlapblackbg { opacity: 1; }

  .wsmenu > .wsmenu-list {
    position: absolute;
    inset-block: var(--mh) 0;
    inset-inline-start: 0;
    width: min(320px, 86vw);
    margin: 0;
    margin-inline-start: calc(-1 * min(320px, 86vw));
    padding: 8px 16px 28px;
    list-style: none;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: var(--panel);
    border-inline-end: 1px solid var(--line);
    transition: margin-inline-start .3s ease;
    font-family: var(--font);
  }
  .wsactive .wsmenu > .wsmenu-list { margin-inline-start: 0; }

  .wsmenu > .wsmenu-list > li { position: relative; border-bottom: 1px solid var(--line); }
  .wsmenu > .wsmenu-list > li > a {
    display: block;
    padding-block: 15px;
    padding-inline: 4px 44px;
    font-size: 18px;
    font-weight: 600;
    color: var(--ink);
    text-decoration: none;
  }
  .wsmenu > .wsmenu-list > li > a.active { color: var(--accent); }
  /* The caret belongs to the .wsmenu-click button in the drawer. */
  .wsmenu > .wsmenu-list > li > a .wsarrow { display: none; }

  /* Accordion chevron injected by the script. */
  .wsmenu-click, .wsmenu-click02 {
    position: absolute;
    top: 0;
    inset-inline-end: 0;
    width: 44px;
    height: 54px;
    cursor: pointer;
    z-index: 2;
  }
  .wsmenu-click .wsmenu-arrow, .wsmenu-click02 .wsmenu-arrow {
    position: absolute;
    top: 22px;
    inset-inline-start: 17px;
    width: 7px;
    height: 7px;
    border-right: 1.6px solid var(--ink-soft);
    border-bottom: 1.6px solid var(--ink-soft);
    transform: rotate(45deg);
    transition: transform .2s ease;
  }
  .wsmenu-click.ws-activearrow .wsmenu-arrow,
  .wsmenu-click02 .wsmenu-arrow.wsmenu-rotate { transform: rotate(225deg); }

  /* Closed until the script slides them open. */
  .wsmenu > .wsmenu-list > li > ul.sub-menu,
  .wsmenu > .wsmenu-list > li > .wsmegamenu { display: none; }
  .wsmenu > .wsmenu-list > li > ul.sub-menu,
  .wsmenu > .wsmenu-list > li > .wsmegamenu,
  .wsmenu .wsmenu-list li ul.sub-menu li ul.sub-menu {
    margin: 0;
    padding: 0 0 10px;
    list-style: none;
  }
  .wsmenu .wsmenu-list li ul.sub-menu li,
  .wsmenu .wsmegamenu .megacollink li { list-style: none; position: relative; }
  .wsmenu .wsmenu-list li ul.sub-menu li > a,
  .wsmenu .wsmegamenu .megacollink li a {
    display: block;
    padding-block: 10px;
    padding-inline: 14px 4px;
    font-size: 16px;
    line-height: 1.45;
    color: var(--ink-soft);
    text-decoration: none;
  }
  .wsmenu .wsmenu-list li ul.sub-menu li > a.active,
  .wsmenu .wsmegamenu .megacollink li a.active { color: var(--accent); }
  .wsmenu .wsmegamenu .megacollink { margin: 0; padding: 0; columns: 1; }

  .wsmenu > .wsmenu-list > li.rightmenu { padding: 14px 4px; border-bottom: 0; }
  .topmenusearch input {
    width: 100%;
    height: 38px;
    padding: 0 10px;
    font: inherit;
    color: var(--ink);
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 2px;
  }
  .topmenusearch button, .topmenusearch .btnstyle { display: none; }
}

/* Focus ring — the masthead's own, in its accent. */
.wsmainfull :focus-visible,
.wsmobileheader :focus-visible,
.wsmenu :focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .wsmainfull *, .wsmenu *, .wsmobileheader * {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
  }
}

/* ── On the ornaments in the original comp ─────────────────────────────────
   The design this layout is drawn from also showed a one-line description and
   a catalogue code under every link, a twelve-month sowing bar, and an aside
   column of editorial copy. None of those have a source in the CMS menu model
   — a MenuItem carries a label, a link, an order and its children, and nothing
   else (Data/Entities/Menu.cs). They are left out rather than filled with
   placeholder text. Adding a description field to MenuItem would light the
   first one up directly: the column rhythm here already has room beneath each
   label for a second line.
   ────────────────────────────────────────────────────────────────────────── */

/* ══════════════════════════════════════════════════════════════════════════
   FITTING THE PAGE  (≥ 992px)
   --------------------------------------------------------------------------
   Two faults this block fixes, both only visible on a real menu:

   1. The bar's inner box was a round number of its own, so it did not land on
      the same rails as the page content below it — measured at 1440px the
      header box was 1280 wide against the page's 1320, leaving the nav visibly
      inset from everything under it. The ladder below is Bootstrap's own
      .container max-widths and gutter, which is what every template here lays
      its pages out with, so the two now share one grid at every breakpoint.

   2. A flex row of nowrap items cannot shrink below its content, so a real
      CMS menu simply overflowed: eleven Hebrew items needed 1214px inside a
      979px box and ran off the leading edge — at 1440px the last item sat at
      x = -104, entirely off-screen, with nothing clipping it.

      The row now tightens before it breaks — type and gutters scale with the
      viewport down to a floor that stays readable — and wraps as the last
      resort, so however many items an editor adds, none is ever cut off.
      Items stretch to the row they land on, so a single row still fills the
      bar and the underline still sits on its floor.
   ══════════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 992px) {
  .wsmainwp, .headtoppart .headerwp { max-width: 960px;  padding-inline: 12px; }

  .wsmainwp { align-items: stretch; gap: clamp(16px, 1.7vw, 36px); }
  .wsmenu   { display: flex; }

  .wsmenu > .wsmenu-list {
    flex: 1 1 auto;
    flex-wrap: wrap;
    align-items: stretch;
    min-height: var(--bar-h);
  }
  .wsmenu > .wsmenu-list > li { display: flex; }
  .wsmenu > .wsmenu-list > li > a {
    height: auto;
    min-height: 50px;
    padding-inline: clamp(9px, .62vw, 14px);
    font-size: clamp(14px, 1.02vw, 16px);
  }

  /* A menu the size of the comp's keeps the design's type scale. A real CMS
     menu is often twice that, and eleven Hebrew labels do not fit a 1320px
     container beside a wordmark at full size — measured, they wanted 1200px of
     a 1050px row. So the scale steps down with the item count instead of the
     row clipping or always breaking in two: :has() counts the items, and where
     it is unsupported the base size stands and the row wraps instead. */
  .wsmenu > .wsmenu-list:has(> li:nth-child(7)) > li > a {
    padding-inline: clamp(7px, .5vw, 12px);
    font-size: clamp(13.5px, .9vw, 15px);
  }
  /* Sized against the container, not the viewport: above 992px the container
     is a step function, so between 1200 and 1400 the row has the same 1140px
     to work with whether the window is 1250 or 1390. A vw curve here just made
     1440 as cramped as 1250 for no reason — measured, it held the row at
     12.5px where 14.5px fits. */
  .wsmenu > .wsmenu-list:has(> li:nth-child(10)) > li > a {
    padding-inline: 7px;
    font-size: 13px;
  }
}
@media only screen and (min-width: 1200px) {
  .wsmainwp, .headtoppart .headerwp { max-width: 1140px; }
  .wsmenu > .wsmenu-list:has(> li:nth-child(10)) > li > a { padding-inline: 6px; font-size: 12.5px; }
}
@media only screen and (min-width: 1400px) {
  .wsmainwp, .headtoppart .headerwp { max-width: 1320px; }
  .wsmenu > .wsmenu-list:has(> li:nth-child(10)) > li > a { padding-inline: 8px; font-size: 14.5px; }
}