/* ============================================================
   RoIntelliA — mobile-fixes.css
   Fix-uri țintite (include DUPĂ style.css):
   1. Nav lizibil la scroll pe mobil (burger + fundal mereu opac)
   2. Elimină overflow orizontal (Samsung/A55: nu mai trebuie zoom out)
   3. Întăriri preventive: tablete, ecrane mari, foldabile, safe-area
   Nu modifică desktopul — totul e în media queries mobile.
   ============================================================ */

/* ------------------------------------------------------------
   [1] ANTI-OVERFLOW GLOBAL (cauza "trebuie zoom out")
   ------------------------------------------------------------ */
html{overflow-x:hidden;max-width:100%}
body{overflow-x:hidden;max-width:100%;position:relative}

/* .pillar::before folosea left/right:-100vw → scăpa pe Samsung Internet.
   Îl limităm la lățimea reală a ecranului, fără scroll orizontal. */
@media(max-width:760px){
  .pillar::before{left:-24px;right:-24px}
}

/* orice element lat accidental nu mai împinge layoutul pe mobil */
@media(max-width:760px){
  .wrap,section,header,footer,main{max-width:100%}
  img,canvas,svg,video,iframe{max-width:100%;height:auto}
}

/* ------------------------------------------------------------
   [2] NAV LIZIBIL PE MOBIL (fix iPhone: burger invizibil la scroll)
   Pe mobil nav-ul primește fundal MEREU (nu doar la .scrolled),
   ca burger-ul să aibă întotdeauna contrast, oriunde ai derula.
   ------------------------------------------------------------ */
@media(max-width:760px){
  .nav{
    background:rgba(10,14,20,.9);
    backdrop-filter:blur(12px) saturate(140%);
    -webkit-backdrop-filter:blur(12px) saturate(140%);
    border-bottom:1px solid var(--line);
    /* safe-area pentru notch/dynamic island (iPhone 15 Pro Max) */
    padding-left:max(var(--gut),env(safe-area-inset-left));
    padding-right:max(var(--gut),env(safe-area-inset-right));
    padding-top:max(14px,env(safe-area-inset-top));
  }
  .nav.scrolled{
    background:rgba(10,14,20,.96);
  }
  /* burger: contrast garantat — linii mai groase + umbră subtilă */
  .burger span{
    height:2.5px;
    box-shadow:0 0 6px rgba(10,14,20,.9);
    background:#fff;
  }
  /* când meniul e deschis, burger-ul devine X pe fundalul plin — fără umbră */
  .burger.open span{box-shadow:none}
}

/* ------------------------------------------------------------
   [3] HERO pe mobil: înălțime corectă cu bara de adrese dinamică
   100vh "sare" pe mobil când apare/dispare bara URL. dvh rezolvă.
   ------------------------------------------------------------ */
@media(max-width:760px){
  .hero{min-height:auto;padding-top:96px}
}
@supports(height:100dvh){
  @media(max-width:760px){
    .hero{min-height:auto}
  }
}

/* ------------------------------------------------------------
   [4] SAMSUNG A55 & ecrane înguste (≤380px): densitate redusă
   ------------------------------------------------------------ */
@media(max-width:400px){
  :root{--gut:16px}
  .nav{padding-left:16px;padding-right:16px}
  .brand{font-size:.92rem;gap:7px}
  .brand-mark{width:24px;height:24px}
  /* titlurile foarte mari nu mai depășesc ecranul */
  .hero h1{font-size:clamp(1.9rem,11vw,2.6rem);word-break:break-word;hyphens:auto}
  h1,h2{overflow-wrap:break-word}
  /* butoanele pline pe lățime, ușor de atins */
  .btn{width:100%;justify-content:center}
  .hero-actions{flex-direction:column;width:100%}
}

/* ------------------------------------------------------------
   [5] TABLETE (portrait 768–1024): coloane intermediare
   ------------------------------------------------------------ */
@media(min-width:761px) and (max-width:1024px){
  .foot-top{grid-template-columns:1fr 1fr}
  .stats{grid-template-columns:1fr 1fr;gap:40px}
}

/* ------------------------------------------------------------
   [6] ECRANE FOARTE MARI (≥1800px): limită de lățime confort lectură
   ------------------------------------------------------------ */
@media(min-width:1800px){
  :root{--maxw:1440px}
  body{font-size:18px}
}

/* ------------------------------------------------------------
   [7] FOLDABILE & touch: ținte de atins minim 44px (WCAG)
   ------------------------------------------------------------ */
@media(hover:none) and (pointer:coarse){
  .nav-links a,.btn,.nav-cta,.burger,.ria-icon-btn,.cc-btn{min-height:44px}
  .nav-links a{display:flex;align-items:center;justify-content:center}
}

/* safe-area jos pentru footer/butoane flotante (cookie recall) pe iPhone */
@supports(padding:max(0px)){
  .cc-recall{bottom:max(18px,env(safe-area-inset-bottom))}
}

/* ------------------------------------------------------------
   [8] FIX CRITIC — meniul mobil deschis trebuie OPAC 100%
   Problema: .nav-links avea background la 97% + backdrop-filter,
   care pe Samsung Internet / iOS lasă conținutul să transpară.
   Soluție: fundal complet opac (fără dependență de backdrop-filter),
   z-index peste bara .nav, context de stacking propriu, scroll blocat.
   ------------------------------------------------------------ */
@media(max-width:760px){
  .nav-links{
    background:#0A0E14 !important;      /* opac 100%, nu 97% */
    background:var(--ink) !important;
    z-index:9998 !important;            /* peste bara .nav (care e sub) */
    /* backdrop-filter e doar bonus; fundalul solid e garanția */
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
    /* acoperire totală, inclusiv sub notch */
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    height:100dvh !important;
    padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom) !important;
    /* permite scroll intern dacă meniul e mai lung ca ecranul */
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch;
  }
  /* burgerul (X) trebuie să rămână DEASUPRA meniului deschis */
  .burger{z-index:9999 !important}
  /* brandul din bară să nu răzbată peste meniu */
  .nav-links.open ~ .brand,
  .nav.scrolled .brand{z-index:1}
}

/* când meniul e deschis, blocăm scroll-ul pe body (evită mișcarea în spate) */
body:has(.nav-links.open){overflow:hidden}
