:root{
  --bg:#0F0F11; --bg-2:#151517; --bg-3:#1D1D20;
  --red1:#7A0C0C; --red2:#8E0E0E;
  --text:#EAEAF0; --muted:#C9CDD6; --border:#2A2A2F;
  --shadow:0 10px 30px rgba(0,0,0,.35);
}
html{scroll-behavior:smooth}
body{background:var(--bg); color:var(--text); -webkit-tap-highlight-color: transparent;}
.container{max-width:1200px}
.card{background:var(--bg-2); border:1px solid var(--border); border-radius:1rem; box-shadow:var(--shadow);}
.btn-red{background:linear-gradient(135deg,var(--red1),var(--red2)); color:#fff; border-radius:1rem;}
.underline-red{height:2px; width:96px; background:linear-gradient(90deg,var(--red1),var(--red2)); border-radius:2px;}
.section-title{letter-spacing:.2px}
.section-strip{background:linear-gradient(135deg,var(--red1),var(--red2)); color:white;}
/* Content protection */
body:not(.allow-select){user-select:none}
img{pointer-events:none}
.no-interact{pointer-events:none}
input, textarea, select, button, a, [role="button"], .allow-select *{user-select:auto}

/* Animations */
@media (prefers-reduced-motion: no-preference){
  .reveal{opacity:0; transform:translateY(24px); transition:opacity .32s cubic-bezier(.22,1,.36,1), transform .32s cubic-bezier(.22,1,.36,1);}
  .revealed{opacity:1; transform:none}
  .hover-lift:hover{transform:translateY(-2px)}
  .wiggle:hover{transform:translateY(-2px) rotate(1deg)}
  .underline-reveal{position:relative; overflow:hidden}
  .underline-reveal::after{content:""; position:absolute; left:0; bottom:-8px; height:2px; width:0; background:linear-gradient(90deg,var(--red1),var(--red2)); transition:width .5s cubic-bezier(.22,1,.36,1);}
  .underline-reveal.revealed::after{width:96px}
}

/* Lang switcher with flags */
.lang-switch { display:flex; gap:.5rem; align-items:center; }
.lang-switch .lang {
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.4rem .55rem; border-radius:999px; border:1px solid rgba(255,255,255,.12);
  background:#111; cursor:pointer; line-height:1; font-weight:700; color:#fff;
}
.lang-switch .lang img { display:block; border-radius:2px; width:18px; height:12px; }
.lang-switch .lang[data-active] { border-color: rgba(255,255,255,.35); box-shadow: 0 0 0 2px rgba(255,255,255,.06) inset; }

/* Mobile overlay nav */
.site-header{ background:rgba(10,10,12,.7); backdrop-filter:blur(8px); border-color:var(--border); }
#mb-drawer[hidden]{ display:none !important; }
#mb-drawer { position: fixed; inset:0; background: rgba(0,0,0,.5); z-index: 60; }
#mb-panel { position: absolute; top:0; right:0; height:100%; width: 320px; background:#111; padding:1.5rem; overflow-y:auto; box-shadow: var(--shadow); transform: translateX(100%); transition: transform .25s ease; }
#mb-drawer[data-open="true"] #mb-panel { transform: translateX(0); }
body.nav-open { overflow: hidden; }

/* RTL helpers */
html[dir="rtl"] .lang-switch { direction: rtl; }


/* Language dropdown */
.lang-dd{ position:relative; }
.lang-dd__btn{ display:flex; align-items:center; gap:.5rem; padding:.35rem .6rem; border:1px solid var(--border); border-radius:.6rem; background:var(--bg-3); }
.lang-dd__flag{ width:18px; height:12px; border-radius:2px; display:block; }
.lang-dd__code{ font-weight:600; letter-spacing:.3px; }
.lang-dd__caret{ font-size:.9em; opacity:.75; }
.lang-dd__menu{ position:absolute; right:0; top:calc(100% + .5rem); background:var(--bg-2); border:1px solid var(--border); border-radius:.6rem; min-width:150px; padding:.25rem; box-shadow:var(--shadow); z-index:70; }
.lang-dd__menu li{ list-style:none; }
.lang-dd__opt{ width:100%; display:flex; align-items:center; gap:.5rem; padding:.45rem .55rem; border-radius:.5rem; }
.lang-dd__opt:hover{ background:var(--bg-3); }

/* === Allow copy & image interaction override === */
body { user-select: auto !important; }
img, .no-interact { pointer-events: auto !important; }
