/* Advanced Nav Menu Pro v5 — Frontend */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;600;700;800&display=swap');
*, *::before, *::after { box-sizing: border-box; }

/* ====================================================
   NAV BAR BASE
   ==================================================== */
.anm-navbar {
    position: fixed;
    left: 0; right: 0;
    z-index: 9990;
    background: var(--anm-bar-bg, #111);
    font-family: var(--anm-font, 'Barlow Condensed', sans-serif);
    height: var(--anm-mob-h, 60px);
    display: flex;
    align-items: stretch;
    box-shadow: 0 2px 24px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.04) inset;
}

/* ── Mobile position ── */
.anm-navbar.anm-mob-bottom { bottom: 0; border-top:    3px solid var(--anm-bar-border, #e8191e); }
.anm-navbar.anm-mob-top    { top:    0; border-bottom: 3px solid var(--anm-bar-border, #e8191e); }
.anm-navbar.anm-mob-none   { display: none; }

/* ── Show/hide by device ── */
.anm-navbar.anm-show-desktop { display: none; }
.anm-navbar.anm-show-mobile,
.anm-navbar.anm-show-both    { display: flex; }

/* ── Cloned bars (second bar for top+bottom) ── */
.anm-navbar.anm-clone { pointer-events: auto; }

/* ====================================================
   BRAND
   ==================================================== */
.anm-brand {
    display: flex; align-items: center; gap: 8px;
    padding: 0 14px 0 12px;
    background: var(--anm-brand-bg, var(--anm-bar-bg));
    border-right: 1px solid rgba(255,255,255,.1);
    text-decoration: none; flex-shrink: 0; height: 100%;
    transition: background .2s;
}
.anm-brand:hover { background: rgba(255,255,255,.06); }
.anm-brand-logo  { height: calc(var(--anm-mob-h, 60px) * .48); max-width: 90px; object-fit: contain; }
.anm-brand-name  {
    color: var(--anm-brand-text, #fff);
    font-family: var(--anm-font, 'Barlow Condensed', sans-serif);
    font-size: calc(var(--anm-mob-fs, 11px) * 1.6);
    font-weight: 800; letter-spacing: .05em; text-transform: uppercase;
    line-height: 1; white-space: nowrap;
}

/* ====================================================
   ITEMS SCROLL — centered when fits, scrolls when not
   ==================================================== */
.anm-items-scroll {
    flex: 1;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    display: flex;           /* ← key for centering */
    align-items: stretch;
}
.anm-items-scroll::-webkit-scrollbar { display: none; }

.anm-items-scroll ul {
    display: flex;
    list-style: none;
    margin: 0 auto;          /* ← auto margins = centered when content < container */
    padding: 0;
    height: 100%;
    /* Do NOT set width:100% — let content determine width so centering works */
}

/* When center is off, align left */
.anm-navbar:not(.anm-center) .anm-items-scroll ul { margin-left: 0; margin-right: 0; }

.anm-items-scroll li { flex-shrink: 0; display: flex; }

/* ====================================================
   ITEMS
   ==================================================== */
.anm-btn, .anm-link {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    gap: 3px; padding: 6px 14px; min-width: 52px;
    background: none; border: none; cursor: pointer;
    color: var(--anm-bar-text, #fff);
    font-family: var(--anm-font, 'Barlow Condensed', sans-serif);
    font-size: var(--anm-mob-fs, 11px);
    font-weight: 600; letter-spacing: .07em;
    text-transform: uppercase; text-decoration: none; line-height: 1;
    transition: color .18s, background .18s;
    -webkit-tap-highlight-color: transparent;
    position: relative; white-space: nowrap;
}
/* Active dot under icon */
.anm-btn::after, .anm-link::after {
    content: '';
    position: absolute; bottom: 5px; left: 50%; transform: translateX(-50%);
    width: 0; height: 3px; background: var(--anm-bar-acc, #e8191e);
    border-radius: 3px; transition: width .18s;
}
.anm-btn:hover, .anm-link:hover { color: var(--anm-bar-acc, #e8191e); background: rgba(255,255,255,.05); }
.anm-btn:hover::after, .anm-link:hover::after,
.anm-btn.is-open::after { width: 24px; }
.anm-btn.is-open { color: var(--anm-bar-acc, #e8191e); }

/* ====================================================
   ICONS
   ==================================================== */
.anm-icon {
    display: block;
    width:  var(--anm-mob-icon, 22px);
    height: var(--anm-mob-icon, 22px);
    flex-shrink: 0; transition: transform .18s;
}
.anm-btn:hover .anm-icon,
.anm-link:hover .anm-icon { transform: translateY(-2px) scale(1.06); }
.anm-custom-icon { object-fit: contain; border-radius: 3px; }
.anm-flag   { font-size: calc(var(--anm-mob-icon, 22px)*.9); line-height:1; display:flex; align-items:center; justify-content:center; }
.anm-letter { display:flex; align-items:center; justify-content:center; width:var(--anm-mob-icon,22px); height:var(--anm-mob-icon,22px); background:var(--anm-bar-acc,#e8191e); color:#fff; font-weight:800; border-radius:4px; font-size:calc(var(--anm-mob-icon,22px)*.65); }

/* Label */
.anm-label { display: block; }

/* ====================================================
   OVERLAYS
   ==================================================== */
.anm-overlay {
    position: fixed; inset: 0; z-index: 9999;
    background: var(--ov-bg, #111);
    color: var(--ov-text, #fff);
    font-family: var(--anm-font, 'Barlow Condensed', sans-serif);
    overflow-y: auto; overscroll-behavior: contain;
    transform: translateY(100%); opacity: 0; visibility: hidden;
    transition: transform .38s cubic-bezier(.4,0,.2,1), opacity .3s, visibility .3s;
}
.anm-overlay.is-open { transform: translateY(0); opacity: 1; visibility: visible; }
.anm-ov-inner { padding: 16px 20px 110px; max-width: 960px; margin: 0 auto; }

.anm-close-btn {
    display: flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; margin-left: auto; margin-bottom: 16px;
    background: rgba(255,255,255,.1); border: none; border-radius: 50%;
    cursor: pointer; color: var(--ov-text, #fff);
    transition: background .2s, transform .22s;
}
.anm-close-btn:hover { background: var(--ov-acc, #e8191e); transform: rotate(90deg); }
.anm-close-btn svg { width: 18px; height: 18px; }

.anm-search {
    display: flex; border-radius: 8px; overflow: hidden;
    background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.1);
    margin-bottom: 28px;
}
.anm-search input[type=search] { flex:1; background:transparent; border:none; outline:none; color:var(--ov-text,#fff); font-family:inherit; font-size:16px; padding:13px 16px; -webkit-appearance:none; }
.anm-search input::placeholder { color:rgba(255,255,255,.38); }
.anm-search button { background:var(--ov-acc,#e8191e); border:none; padding:0 18px; cursor:pointer; color:#fff; display:flex; align-items:center; justify-content:center; }
.anm-search button svg { width:20px; height:20px; }

.anm-sections-grid { display:grid; grid-template-columns:repeat(var(--ov-cols,2),1fr); gap:28px 24px; align-items:start; }
.anm-sec-title { font-size:21px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; margin:0 0 12px; padding-bottom:8px; border-bottom:2px solid var(--ov-acc,#e8191e); color:var(--ov-text,#fff); }
.anm-links { list-style:none; margin:0; padding:0; }
.anm-links a { display:block; color:rgba(255,255,255,.7); text-decoration:none; font-size:15px; font-weight:500; padding:7px 0; border-bottom:1px solid rgba(255,255,255,.07); transition:color .15s, padding-left .15s; }
.anm-links a:hover { color:var(--ov-acc,#e8191e); padding-left:7px; }
.anm-links .anm-first { color:var(--ov-acc,#e8191e); font-weight:700; font-size:16px; }

/* ====================================================
   DESKTOP  ≥ 768px
   ==================================================== */
@media (min-width: 768px) {
    .anm-navbar.anm-show-mobile  { display: none !important; }
    .anm-navbar.anm-show-desktop { display: flex; }
    .anm-navbar.anm-show-both    { display: flex; }

    .anm-navbar.anm-show-both,
    .anm-navbar.anm-show-desktop { height: var(--anm-desk-h, 52px); }

    /* Desktop vertical position */
    .anm-navbar.anm-desk-top    { top:0;    bottom:auto; border-top:none;   border-bottom:3px solid var(--anm-bar-border,#e8191e); box-shadow:0 3px 24px rgba(0,0,0,.45); }
    .anm-navbar.anm-desk-bottom { bottom:0; top:auto;    border-bottom:none; border-top:3px solid var(--anm-bar-border,#e8191e);   box-shadow:0 -3px 24px rgba(0,0,0,.45); }
    .anm-navbar.anm-desk-none   { display: none !important; }

    /* Item layout on desktop — horizontal */
    .anm-btn, .anm-link { flex-direction:row; gap:8px; padding:0 18px; min-width:unset; font-size:var(--anm-desk-fs,13px); }
    .anm-btn::after, .anm-link::after { display: none; }  /* no dot on desktop */
    .anm-icon   { width:var(--anm-desk-icon,18px); height:var(--anm-desk-icon,18px); }
    .anm-flag   { font-size:calc(var(--anm-desk-icon,18px)*.9); }
    .anm-letter { width:var(--anm-desk-icon,18px); height:var(--anm-desk-icon,18px); font-size:calc(var(--anm-desk-icon,18px)*.65); }

    .anm-brand-logo { height:calc(var(--anm-desk-h,52px)*.52); }
    .anm-brand-name { font-size:calc(var(--anm-desk-fs,13px)*1.5); }

    /* Overlay from top on desktop */
    .anm-overlay { transform: translateY(-100%); }
    .anm-overlay.is-open { transform: translateY(0); }
    .anm-ov-inner { padding: 30px 48px 60px; }
    .anm-sections-grid { gap: 36px 32px; }

    .anm-overlay.anm-show-mobile { display: none !important; }
}
@media (max-width: 767px) {
    .anm-navbar.anm-show-desktop { display: none !important; }
    .anm-overlay.anm-show-desktop { display: none !important; }
}

/* ── None display (hidden on all devices — menu/overlay disabled) ── */
.anm-navbar.anm-show-none,
.anm-overlay.anm-show-none { display: none !important; }