/* SMF Nav Polish — header menu layout. Desktop ≥861px; phone: Blog | Opinion bar in header + first in menu. */
@media (min-width: 861px) {
  #smfNavShell .smf-site-header { max-width: 1400px; }
  #smfNavShell .smf-nav { min-height: 76px; padding: 12px 24px; gap: 24px; flex-wrap: nowrap; }

  /* Brand: kicker on one line, name on one line */
  #smfNavShell .smf-brand { flex: 0 0 auto; gap: 4px; }
  #smfNavShell .smf-brand-kicker { font-size: 10px; letter-spacing: .22em; white-space: nowrap; }
  #smfNavShell .smf-brand-name { font-size: 25px; white-space: nowrap; }

  /* Menu row */
  #smfNavShell .smf-nav { justify-content: space-between; }
  #smfNavShell .smf-nav-desktop { flex: 0 0 auto; justify-content: flex-end; gap: 2px; }
  /* Flatten both link lists so Opinion can sit next to Blog */
  #smfNavShell .smf-nav-desktop > .smf-nav-links { display: contents !important; }
  #smfNavShell .smf-nav-links > li { position: relative; list-style: none; order: 3; }
  #smfNavShell .smf-nav-links > li.menu-item-9016091 { order: 1; }  /* Blog */
  #smfNavShell .smf-nav-links-extra > li { order: 2; }             /* Opinion */
  #smfNavShell .smf-nav-report { order: 4; }
  #smfNavShell .smf-nav-links > li > a {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 9px 10px; border-radius: 999px;
    font-size: 12px; letter-spacing: .07em; white-space: nowrap; line-height: 1;
    color: var(--ink-soft);
    transition: color .2s ease, background-color .2s ease;
  }
  #smfNavShell .smf-nav-links > li > a:hover,
  #smfNavShell .smf-nav-links > li:focus-within > a { color: var(--gold-3); background: rgba(171,122,47,.08); }
  #smfNavShell .smf-nav-links > li.current-menu-item > a,
  #smfNavShell .smf-nav-links > li.current-menu-ancestor > a { color: var(--gold-3); }
  #smfNavShell .smf-nav-links > li > a:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

  /* Blog + Opinion: one gold-outlined "reading" pill, set apart from the other links */
  #smfNavShell .smf-nav-links > li.menu-item-9016091 > a,
  #smfNavShell .smf-nav-links-extra > li > a {
    color: var(--gold-3); font-weight: 700;
    background: #fbf4e8; border: 1px solid rgba(171,122,47,.45);
    padding-top: 8px; padding-bottom: 8px;
  }
  #smfNavShell .smf-nav-links > li.menu-item-9016091 > a {
    border-radius: 999px 0 0 999px; border-right: 0; padding-left: 14px; padding-right: 11px;
  }
  #smfNavShell .smf-nav-links-extra > li { margin-left: -2px; margin-right: 10px; }
  #smfNavShell .smf-nav-links-extra > li > a {
    border-radius: 0 999px 999px 0; padding-left: 11px; padding-right: 14px;
    box-shadow: inset 1px 0 0 rgba(171,122,47,.35); /* divider between the two */
  }
  #smfNavShell .smf-nav-links > li.menu-item-9016091 > a:hover,
  #smfNavShell .smf-nav-links-extra > li > a:hover,
  #smfNavShell .smf-nav-links > li.menu-item-9016091:focus-within > a,
  #smfNavShell .smf-nav-links-extra > li:focus-within > a { background: #f3e4c8; color: var(--gold-3); }

  /* Dropdown caret */
  #smfNavShell .smf-nav-links > li.menu-item-has-children > a::after {
    content: ""; width: 6px; height: 6px; margin-top: -3px;
    border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg); transition: transform .2s ease, margin .2s ease;
  }
  #smfNavShell .smf-nav-links > li.menu-item-has-children:hover > a::after,
  #smfNavShell .smf-nav-links > li.menu-item-has-children:focus-within > a::after { transform: rotate(-135deg); margin-top: 3px; }

  /* Dropdown panel (was rendering as an open bulleted list) */
  #smfNavShell .smf-nav-links .sub-menu {
    position: absolute; top: 100%; left: 0; z-index: 300;
    min-width: 200px; margin: 0; padding: 8px; list-style: none;
    background: var(--white); border: 1px solid var(--border-2); border-radius: 14px;
    box-shadow: var(--shadow-lg);
    opacity: 0; visibility: hidden; transform: translateY(6px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
  }
  /* hover bridge so the panel doesn't close crossing the gap */
  #smfNavShell .smf-nav-links .sub-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; }
  #smfNavShell .smf-nav-links > li:hover > .sub-menu,
  #smfNavShell .smf-nav-links > li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(4px); }
  #smfNavShell .smf-nav-links .sub-menu li { list-style: none; margin: 0; }
  #smfNavShell .smf-nav-links .sub-menu a {
    display: block; padding: 10px 14px; border-radius: 9px;
    font-size: 12px; letter-spacing: .08em; white-space: nowrap; color: var(--ink-soft);
  }
  #smfNavShell .smf-nav-links .sub-menu a:hover,
  #smfNavShell .smf-nav-links .sub-menu a:focus-visible { background: var(--cream); color: var(--gold-3); outline: none; }

  /* CTA: one line, compact, separated from the links */
  #smfNavShell .smf-nav-report {
    flex: 0 0 auto; margin-left: 10px; white-space: nowrap;
    padding: 11px 20px; font-size: 11.5px; letter-spacing: .1em;
  }
}

/* Narrower desktops (861–1359px): two rows — brand + CTA on top, links centred below */
@media (min-width: 861px) and (max-width: 1359px) {
  #smfNavShell .smf-nav { flex-wrap: wrap; row-gap: 6px; padding: 12px 24px 8px; min-height: 0; }
  #smfNavShell .smf-nav-desktop { display: contents !important; }
  #smfNavShell .smf-brand { order: 1; }
  #smfNavShell .smf-nav-report { order: 2; margin-left: auto; }
  #smfNavShell .smf-nav::after { content: ""; order: 3; flex-basis: 100%; height: 0; }
  #smfNavShell .smf-nav { column-gap: 2px; }
  #smfNavShell .smf-nav-links > li { order: 6; }
  #smfNavShell .smf-nav-links > li.menu-item-9016091 { order: 4; margin-left: auto; } /* Blog starts row 2 */
  #smfNavShell .smf-nav-links-extra > li { order: 5; }
  #smfNavShell .smf-nav-links > li.smf-nav-partner { margin-right: auto; }            /* last item closes row 2 */
  #smfNavShell .smf-nav-links > li > a { padding: 8px 10px; font-size: 12px; letter-spacing: .07em; }
}
@media (min-width: 861px) and (max-width: 979px) {
  #smfNavShell .smf-nav-links > li > a { padding: 8px 7px; font-size: 11.5px; letter-spacing: .04em; }
}

/* Phone menu (≤860px): Opinion directly under Blog, both highlighted */
@media (max-width: 860px) {
  #smfNavShell #smfMobileMenuInner { display: flex !important; flex-direction: column !important; }
  #smfNavShell #smfMobileMenu ul.smf-mobile-menu-list { display: contents !important; }
  #smfNavShell #smfMobileMenu .smf-mobile-menu-list > li { order: 3; }
  #smfNavShell #smfMobileMenu .smf-mobile-menu-list > li.menu-item-9016091 { order: 1; }
  #smfNavShell #smfMobileMenu .smf-mobile-menu-list + .smf-mobile-menu-list > li { order: 2; }
  #smfNavShell #smfMobileMenu .smf-mobile-report { order: 4; }
  #smfNavShell #smfMobileMenu .smf-mobile-menu-list > li.menu-item-9016091 > a,
  #smfNavShell #smfMobileMenu .smf-mobile-menu-list + .smf-mobile-menu-list > li > a {
    color: var(--gold-3) !important; font-weight: 700 !important;
    background: #fbf4e8 !important; padding: 0 12px !important;
    border-left: 3px solid var(--gold) !important;
  }

  /* Always-visible Blog | Opinion bar in the phone header (no need to open the menu) */
  #smfNavShell .smf-nav { flex-wrap: wrap; row-gap: 10px; }
  #smfNavShell .smf-nav > .smf-brand { order: 1; flex: 1 1 0; min-width: 0; }
  #smfNavShell .smf-nav > .smf-nav-toggle { order: 2; flex: 0 0 auto; }
  #smfNavShell .smf-nav .smf-nav-desktop {
    display: flex !important; order: 3; flex: 0 0 100%; gap: 0; margin: 0;
  }
  #smfNavShell .smf-nav .smf-nav-desktop > .smf-nav-links { display: contents !important; }
  #smfNavShell .smf-nav .smf-nav-desktop li,
  #smfNavShell .smf-nav .smf-nav-desktop .smf-nav-report { display: none !important; }
  #smfNavShell .smf-nav .smf-nav-desktop li.menu-item-9016091,
  #smfNavShell .smf-nav .smf-nav-desktop .smf-nav-links-extra > li {
    display: block !important; flex: 1 1 50%; list-style: none; margin: 0;
  }
  #smfNavShell .smf-nav .smf-nav-desktop li.menu-item-9016091 { order: 1; }
  #smfNavShell .smf-nav .smf-nav-desktop .smf-nav-links-extra > li { order: 2; }
  #smfNavShell .smf-nav .smf-nav-desktop li.menu-item-9016091 > a,
  #smfNavShell .smf-nav .smf-nav-desktop .smf-nav-links-extra > li > a {
    display: flex; align-items: center; justify-content: center; min-height: 42px;
    font-family: Inter, sans-serif; font-size: 13px; font-weight: 700; letter-spacing: .1em;
    text-transform: uppercase; text-decoration: none; color: var(--gold-3);
    background: #fbf4e8; border: 1px solid rgba(171,122,47,.45);
  }
  #smfNavShell .smf-nav .smf-nav-desktop li.menu-item-9016091 > a { border-radius: 999px 0 0 999px; border-right: 0; }
  #smfNavShell .smf-nav .smf-nav-desktop .smf-nav-links-extra > li > a {
    border-radius: 0 999px 999px 0; box-shadow: inset 1px 0 0 rgba(171,122,47,.35);
  }
  #smfNavShell .smf-nav .smf-nav-desktop li > a:active { background: #f3e4c8; }
}
