/* ==========================================================
   ELXR_Ø — polish layer (loaded last on every page)
   Language dropdown with flags + professional refinements.
   ========================================================== */

:root{
    --ease:cubic-bezier(.22,.61,.36,1);
    --accent:#c9a227;
    --text-strong:#ececec;
    --text-soft:#a8a8a8;
    --text-dim:#8a8a8a;
}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-rendering:optimizeLegibility;
    line-height:1.6;
}
::selection{background:rgba(201,162,39,.35);color:#fff;}

/* Accessible focus */
a:focus-visible,button:focus-visible,[tabindex]:focus-visible,input:focus-visible{
    outline:1px solid var(--accent);
    outline-offset:4px;
}

/* Skinny dark scrollbars */
*{scrollbar-width:thin;scrollbar-color:#2a2a2a transparent;}
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-thumb{background:#2a2a2a;}

/* ---------- NAVIGATION ---------- */
nav{
    padding:20px 6% !important;
    gap:20px;
    background:rgba(5,5,5,.88) !important;
    -webkit-backdrop-filter:blur(14px);
    backdrop-filter:blur(14px);
}
.logo{font-weight:400 !important;color:var(--text-strong);}
.nav-links{align-items:center;}
.nav-links a{
    position:relative;
    color:var(--text-dim) !important;
    transition:color .3s var(--ease);
    padding:6px 0;
}
.nav-links a::after{
    content:"";
    position:absolute;left:0;right:100%;bottom:0;
    height:1px;background:var(--text-strong);
    transition:right .35s var(--ease);
}
.nav-links a:hover,.nav-links a.active{color:#fff !important;}
.nav-links a:hover::after,.nav-links a.active::after{right:0;}

/* ---------- LANGUAGE DROPDOWN (flags) ---------- */
nav .lang-switch{
    position:relative;
    display:block;
    margin:0 0 0 24px;
    flex:0 0 auto;
}
.lang-switch .flag{
    display:inline-flex;
    width:22px;height:15px;
    flex:0 0 22px;
    border-radius:2px;
    overflow:hidden;
    box-shadow:0 0 0 1px rgba(255,255,255,.18);
}
.lang-switch .flag svg{width:100%;height:100%;display:block;}

.lang-switch .lang-current{
    display:flex;align-items:center;gap:9px;
    background:transparent;
    border:1px solid rgba(255,255,255,.14);
    color:var(--text-soft);
    font-family:'Inter',sans-serif;
    font-size:.68rem;letter-spacing:.14rem;
    padding:8px 11px;
    min-height:36px;
    cursor:pointer;
    transition:border-color .3s var(--ease),color .3s var(--ease);
}
.lang-switch .lang-current:hover,
.lang-switch.open .lang-current{color:#fff;border-color:rgba(255,255,255,.4);}
.lang-chevron{width:9px;height:6px;transition:transform .3s var(--ease);}
.lang-switch.open .lang-chevron{transform:rotate(180deg);}

.lang-menu{
    list-style:none;
    position:absolute;
    top:calc(100% + 10px);
    right:0;
    min-width:190px;
    background:rgba(10,10,10,.98);
    border:1px solid rgba(255,255,255,.12);
    box-shadow:0 18px 50px rgba(0,0,0,.6);
    padding:6px;
    opacity:0;visibility:hidden;
    transform:translateY(-6px);
    transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s;
    z-index:10001;
}
.lang-switch.open .lang-menu{opacity:1;visibility:visible;transform:none;}

.lang-opt{
    width:100%;
    display:flex;align-items:center;gap:12px;
    background:transparent;border:0;
    color:var(--text-soft);
    font-family:'Inter',sans-serif;
    font-size:.82rem;letter-spacing:.03rem;
    padding:12px 12px;
    min-height:44px;               /* comfortable touch target */
    text-align:left;
    cursor:pointer;
    transition:background .2s,color .2s;
}
.lang-opt .lang-name{flex:1;}
.lang-opt .lang-code{font-size:.6rem;letter-spacing:.15rem;color:#666;}
.lang-opt:hover{background:rgba(255,255,255,.05);color:#fff;}
.lang-opt.active-lang{color:#fff;background:rgba(255,255,255,.04);}
.lang-opt.active-lang .lang-code{color:var(--accent);}

/* ---------- MOBILE NAV ---------- */
@media(max-width:768px){
    nav{padding:14px 5% !important;gap:0;}
    .logo{font-size:.9rem !important;letter-spacing:.4rem !important;margin-right:auto;}

    /* flag button sits beside the burger: flag only, no clutter */
    nav .lang-switch{margin:0 14px 0 0;order:2;}
    .lang-switch .lang-current .lang-code,
    .lang-switch .lang-chevron{display:none;}
    .lang-switch .lang-current{padding:0 10px;width:44px;height:40px;justify-content:center;}
    .lang-switch .flag{width:24px;height:16px;flex-basis:24px;}
    .nav-toggle{order:3;padding:12px 4px;margin-right:-4px;}
    .nav-links{order:4;}

    .lang-menu{right:-4px;min-width:min(240px,calc(100vw - 10%));}

    /* drawer */
    .nav-links{
        -webkit-backdrop-filter:none !important;
        backdrop-filter:none !important;
        background:rgba(5,5,5,.99) !important;
        gap:34px !important;
        box-shadow:-30px 0 60px rgba(0,0,0,.5);
    }
    .nav-links a{font-size:.9rem !important;letter-spacing:.25rem !important;}
    .nav-links a::after{display:none;}
}

/* ---------- TYPOGRAPHY & CONTENT ---------- */
.hero p,.manifest-panel p,.legal-panel p,.menu-modal-desc{color:var(--text-soft) !important;}
.card p,.footer-text{color:var(--text-dim) !important;}
.archive-label,.code,.formula,.menu-card-code{color:#8a8a8a !important;}
.nav-links a.inactive{color:#5c5c5c !important;}

.hero h1{letter-spacing:-.01em;}
.section-header span{
    display:block;margin-bottom:14px;
    text-transform:uppercase;font-size:.7rem !important;letter-spacing:.35rem !important;
}
.section-header h2{letter-spacing:-.005em;}

/* Cards: calmer, more refined hover */
.card,.menu-card{transition:transform .5s var(--ease),border-color .5s var(--ease),box-shadow .5s var(--ease) !important;}
.card:hover,.menu-card:hover{
    transform:translateY(-5px) !important;
    border-color:rgba(255,255,255,.22) !important;
    box-shadow:0 24px 60px rgba(0,0,0,.45);
}

/* Buttons / tags */
.age-btn,.error-link,.type-tag{transition:all .3s var(--ease) !important;}
.age-btn:not(.deny){background:#e8e8e8;color:#050505;border-color:#e8e8e8;}
.age-btn:not(.deny):hover{background:#fff;color:#000;}
.type-tag{color:#8a8a8a !important;}
.type-tag.active-filter{background:rgba(255,255,255,.06);}

/* ---------- FOOTER ---------- */
footer{
    padding:72px 8% 56px !important;
    border-top:1px solid rgba(255,255,255,.08);
    text-align:center;
    color:#7a7a7a;
    font-size:.78rem;
    letter-spacing:.08rem;
    line-height:1.9;
}
footer .footer-logo{font-size:1.5rem !important;letter-spacing:.5rem;margin-bottom:12px !important;color:var(--text-strong);}
footer .footer-text{margin:0 auto !important;max-width:560px;}
.footer-social{gap:28px !important;margin-top:28px !important;}
.footer-social a{color:#8a8a8a !important;padding-bottom:3px;}
.footer-social a:hover{color:#fff !important;border-color:#fff !important;}

/* ---------- SECTIONS & SPACING ---------- */
.section{padding:120px 8%;}
@media(max-width:768px){
    .section{padding:80px 6% !important;}
    .section-header{margin-bottom:44px !important;}
    .section-header h2{font-size:2.2rem !important;}
    .hero{padding:0 7% !important;}
    .hero h1{font-size:clamp(2.8rem,13vw,4rem) !important;line-height:.98 !important;}
    .glow-ring{width:260px !important;height:260px !important;}
    .manifest-panel{padding:32px 26px !important;}
    .menu-grid{padding:0 5% 80px !important;grid-template-columns:1fr !important;}
    footer{padding:56px 6% 44px !important;}
}

/* Age gate: cleaner, more formal */
.age-gate-box{
    padding:48px 40px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(10,10,10,.85);
}
@media(max-width:520px){.age-gate{padding:20px;} .age-gate-box{padding:36px 24px;} .age-gate h2{font-size:2rem;}}

/* Respect reduced motion */
@media(prefers-reduced-motion:reduce){
    html{scroll-behavior:auto;}
    *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;}
}

/* Age-gate language picker */
.age-lang{display:flex;justify-content:center;gap:10px;margin-bottom:30px;}
.age-lang-btn{
    background:transparent;border:1px solid rgba(255,255,255,.12);
    padding:8px 9px;cursor:pointer;line-height:0;opacity:.55;
    transition:opacity .25s,border-color .25s;
}
.age-lang-btn:hover{opacity:1;border-color:rgba(255,255,255,.4);}
.age-lang-btn.active-lang{opacity:1;border-color:var(--accent);}
.age-lang-btn .flag{display:inline-flex;width:24px;height:16px;border-radius:2px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.18);}
.age-lang-btn .flag svg{width:100%;height:100%;display:block;}
.age-gate{overflow-y:auto;}

/* Age gate: stay reachable on short screens (landscape phones) */
.age-gate{align-items:flex-start !important;}
.age-gate-box{margin:auto;}
