/* ============ TOKENS ============ */
:root{
  --bg:#0A0D10;
  --bg-alt:#0E1216;
  --surface:#141A20;
  --surface-2:#1A2129;
  --line:rgba(237,234,227,0.09);
  --line-strong:rgba(237,234,227,0.16);
  --text:#EDEAE3;
  --text-muted:#8B94A0;
  --text-faint:#5B6470;
  --copper:#D98A44;
  --copper-bright:#F2A93C;
  --copper-dim:#7A5330;
  --blue:#4FB3FF;
  --danger:#E85D4F;
  --radius:2px;
  --ease:cubic-bezier(.22,.9,.32,1);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',sans-serif;
  font-size:16px;
  line-height:1.6;
  overflow-x:hidden;
}
body.locked{overflow:hidden; height:100vh;}
h1,h2,h3,h4{font-family:'Space Grotesk',sans-serif; font-weight:700; letter-spacing:-0.01em; line-height:1.08;}
.mono{font-family:'IBM Plex Mono',monospace;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
button{font-family:inherit; cursor:pointer;}
.wrap{max-width:1280px; margin:0 auto; padding:0 clamp(20px,5vw,40px);}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--copper);
  display:flex; align-items:center; gap:10px;
  margin-bottom:18px;
}
.eyebrow::before{content:""; width:22px; height:1px; background:var(--copper);}
::selection{background:var(--copper); color:#0A0D10;}
:focus-visible{outline:2px solid var(--copper-bright); outline-offset:3px;}
.skip-link{
  position:fixed; top:-60px; left:16px; z-index:10000;
  background:var(--copper-bright); color:#0A0D10; padding:12px 20px;
  font-family:'IBM Plex Mono',monospace; font-size:13px; font-weight:600;
  transition:top .25s var(--ease);
}
.skip-link:focus{top:16px;}

/* ============ LOADER ============ */
#loader{
  position:fixed; inset:0; z-index:9999;
  background:var(--bg);
  display:flex; align-items:center; justify-content:center;
  /* Îmbunătățire: Tranziție fluidă combinată cu de-blur premium la ascundere */
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: opacity .8s var(--ease), visibility .8s var(--ease), backdrop-filter .8s var(--ease);
}
#loader.hide{
  opacity:0; 
  visibility:hidden; 
  pointer-events:none;
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
}
.loader-inner{display:flex; flex-direction:column; align-items:center; gap:34px; width:min(90vw,380px);}
.loader-logo{
  font-family:'Space Grotesk',sans-serif; font-weight:700;
  font-size:22px; letter-spacing:0.04em;
  display:flex; align-items:center; gap:12px; color:var(--text);
  text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}
.loader-logo span{color:var(--copper); transition: text-shadow 0.3s ease;}
.breaker-row{display:flex; gap:7px;}
.breaker{
  width:11px; height:26px;
  background:var(--surface-2);
  border:1px solid var(--line-strong);
  border-radius:2px;
  position:relative;
  /* Îmbunătățire: Umbră internă pentru adâncime 3D realistă de siguranță electrică */
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.5);
  transition: background .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.breaker::after{
  content:""; position:absolute; left:1px; right:1px; height:9px;
  background:var(--text-faint); bottom:1px; border-radius:1px;
  transition:transform .25s var(--ease), background .25s var(--ease), bottom .25s var(--ease), box-shadow .25s var(--ease);
}
.breaker.on{
  background:rgba(217,138,68,0.15); 
  border-color: rgba(242,169,60,0.4);
  box-shadow: 0 0 14px rgba(242,169,60,0.45), inset 0 1px 2px rgba(255,255,255,0.1);
}
.breaker.on::after{
  background:var(--copper-bright); 
  bottom:auto; 
  top:1px;
  box-shadow: 0 0 6px var(--copper-bright);
}
.loader-bar-track{
  width:100%; height:2px; background:var(--line-strong); position:relative; overflow:hidden;
  border-radius: 1px;
}
.loader-bar-fill{
  height:100%; width:0%; background:linear-gradient(90deg,var(--copper-dim),var(--copper-bright));
  box-shadow:0 0 10px rgba(242,169,60,0.8);
}
.loader-pct{font-size:12px; color:var(--text-muted); letter-spacing:0.1em; font-weight: 500;}

/* ============ ANIMATED LOGO MARK & PREMIUM HOVER ============ */
.logo-flex{
  display:flex; 
  align-items:center; 
  gap:12px;
  text-decoration: none;
  cursor: pointer;
  position: relative;
  overflow: hidden; /* Necesar pentru a tăia reflexia metalică (shimmer) */
  padding: 4px 0; 
  border-radius: 6px;
  transition: background-color 0.3s var(--ease);
  flex-shrink: 0; /* Blochează complet deformarea containerului */
}
.logo-mark{
  width:36px; 
  height:36px; 
  flex:none; 
  position:relative; 
  will-change: transform;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
.logo-mark svg{width:100%; height:100%; display:block;}

.logo-mark .bolt{
  animation: boltFlicker 3.6s ease-in-out infinite;
  transform-origin:center;
  transition: fill 0.3s ease, filter 0.3s ease;
}
.logo-mark .spark{
  animation: sparkPulse 2.2s ease-in-out infinite;
  /* Îmbunătățire: Punctul de origine calibrat special pe centrul geometric al scânteii SVG (17.3, 6.3) */
  transform-origin: 17.3px 6.3px; 
  transition: fill 0.3s ease;
}
.logo-mark .ring{
  animation: ringSpin 9s linear infinite;
  transform-origin:12px 12px;
}

/* Stiluri pentru textul logo-ului din Header */
.logo-flex .logo {
  will-change: transform;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
.logo-flex .name {
  font-weight: 700;
}
.logo-flex .name span {
  transition: color 0.4s ease, text-shadow 0.4s ease;
}
.logo-flex .sub {
  /* FIX: Am adăugat tranziție doar pentru culoare și opacitate. FĂRĂ letter-spacing sau font-size la hover! */
  transition: color 0.4s ease, opacity 0.4s ease;
}

/* ----- EFECTE DE HOVER ACTIVE (FĂRĂ DEPLASĂRI DE TEXT) ----- */

/* 1. Rotire și mărire micro-dinamică a emblemei (izolată complet în interiorul ei) */
.logo-flex:hover .logo-mark {
  transform: scale(1.05) rotate(-2deg);
}

/* 2. Accelerare flicker și glow intens pe fulger (cupru electric) */
.logo-flex:hover .bolt {
  fill: #FFBA53;
  filter: drop-shadow(0 0 6px rgba(242, 169, 60, 0.95));
}

/* 3. Scânteia pulsează mult mai intens la hover */
.logo-flex:hover .spark {
  fill: #73C2FF;
  animation: sparkPulseActive 0.8s infinite alternate ease-in-out;
}

/* 4. Aprindere neon pe ELECTRICAL (numele rămâne complet fix pe poziție) */
.logo-flex:hover .name span {
  color: var(--copper-bright, #F2A93C);
  text-shadow: 0 0 8px rgba(242, 169, 60, 0.5);
}

/* 5. Subtitlul devine discret mai vizibil (fără să-și schimbe lățimea fizică) */
.logo-flex:hover .sub {
  color: var(--text, #edeae3) !important;
  opacity: 0.9;
}

/* 6. Reflexie metalică fină (Shimmer) care traversează logo-ul */
.logo-flex::after {
  content: '';
  position: absolute;
  top: 0;
  left: -150%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    90deg, 
    rgba(255, 255, 255, 0) 0%, 
    rgba(255, 255, 255, 0.12) 50%, 
    rgba(255, 255, 255, 0) 100%
  );
  transform: skewX(-20deg);
  pointer-events: none;
  z-index: 5;
}
.logo-flex:hover::after {
  left: 150%;
  transition: left 0.85s cubic-bezier(0.23, 1, 0.32, 1);
}

/* Keyframes suplimentare pentru starea activă de pe scânteie */
@keyframes sparkPulseActive {
  0% { transform: scale(0.9); filter: drop-shadow(0 0 2px rgba(79, 179, 255, 0.6)); }
  100% { transform: scale(1.4); filter: drop-shadow(0 0 8px rgba(79, 179, 255, 1)); }
}

@keyframes boltFlicker{
  0%, 84%, 100%{ opacity:1; filter:drop-shadow(0 0 2px rgba(242,169,60,.55)); }
  88%{ opacity:.4; filter:none; }
  90%{ opacity:1; filter:drop-shadow(0 0 6px rgba(242,169,60,.9)); }
  92%{ opacity:.5; filter:none; }
}
@keyframes sparkPulse{
  0%,100%{ opacity:.5; transform: scale(0.95); }
  50%{ opacity:1; transform: scale(1.35); filter:drop-shadow(0 0 6px rgba(79,179,255,.95)); }
}
@keyframes ringSpin{ to{ transform:rotate(360deg); } }
.loader-logo .logo-mark{width:30px; height:30px;}

/* ============ CURRENT RAIL (signature element) ============ */
.rail{
  position:fixed; left:40px; top:0; bottom:0; width:1px; z-index:40;
  display:flex; flex-direction:column; align-items:center;
  pointer-events:none;
}
.rail::before{
  content:""; position:absolute; top:0; bottom:0; left:0; width:1px;
  background:var(--line-strong);
}
.rail-pulse{
  position:absolute; left:-2px; width:5px; height:90px;
  background:linear-gradient(180deg, transparent, var(--copper-bright), transparent);
  filter:blur(1px);
  /* Îmbunătățire: S-a adăugat o animație secundară de pâlpâire a intensității curentului la coborâre */
  animation: railmove 5.5s linear infinite, railFlicker 0.2s alternate infinite ease-in-out;
  opacity:.85;
}
@keyframes railmove{
  0%{ top:-90px; }
  100%{ top:100%; }
}
@keyframes railFlicker{
  0% { opacity: 0.7; }
  100% { opacity: 0.95; filter: blur(1.2px) drop-shadow(0 0 2px rgba(242, 169, 60, 0.5)); }
}
.rail-node{
  position:absolute; left:-3px; width:7px; height:7px; border-radius:50%;
  background:var(--surface-2); border:1px solid var(--line-strong);
  transition:background .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
}
.rail-node.active{
  background:var(--copper-bright); 
  border-color:var(--copper-bright); 
  box-shadow:0 0 10px rgba(242,169,60,.8);
}
@media (max-width:1100px){ .rail{display:none;} }

/* ============ NAV ============ */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:26px 0;
  transition:padding .35s var(--ease), background .35s var(--ease), border-color .35s var(--ease);
  border-bottom:1px solid transparent;
}
header.scrolled{
  padding:16px 0; background:rgba(10,13,16,0.86); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
header .wrap{display:flex; align-items:center; justify-content:space-between;}
.logo{display:flex; flex-direction:column; line-height:1;}
.logo .name{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:19px; letter-spacing:0.02em;}
.logo .name span{color:var(--copper);}
.logo .sub{font-family:'IBM Plex Mono',monospace; font-size:9.5px; letter-spacing:0.22em; color:var(--text-faint); margin-top:4px;}
nav ul{list-style:none; display:flex; gap:38px;}
nav a{
  font-size:14px; color:var(--text-muted); position:relative; padding-bottom:4px;
  transition:color .25s;
}
nav a:hover, nav a.active{color:var(--text);}
nav a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--copper-bright);
  transition:width .3s var(--ease);
}
nav a:hover::after, nav a.active::after{width:100%;}
.nav-right{display:flex; align-items:center; gap:28px;}
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:12px 22px; font-size:13.5px; font-weight:600;
  border-radius:var(--radius); border:1px solid transparent;
  transition:all .3s var(--ease); white-space:nowrap;
}
.btn-primary{background:var(--copper-bright); color:#0A0D10;}
.btn-primary:hover{background:var(--text); box-shadow:0 6px 24px rgba(242,169,60,.25);}
.btn-ghost{border-color:var(--line-strong); color:var(--text);}
.btn-ghost:hover{border-color:var(--copper-bright); color:var(--copper-bright);}
.burger{display:none; flex-direction:column; gap:5px; background:none; border:none;}
.burger span{width:22px; height:1px; background:var(--text);}
@media (max-width:920px){
  nav{position:fixed; inset:0 0 0 auto; width:78vw; max-width:340px; background:var(--bg-alt); border-left:1px solid var(--line);
      transform:translateX(100%); transition:transform .4s var(--ease); padding:100px 34px; z-index:99;}
  nav.open{transform:translateX(0);}
  nav ul{flex-direction:column; gap:26px;}
  .nav-right .btn-ghost{display:none;}
  .burger{display:flex;}
}
@media (max-width:480px){
  header .wrap{gap:10px;}
  .logo-flex{gap:8px;}
  .logo-mark{width:30px; height:30px;}
  .logo .name{font-size:15px;}
  .logo .sub{display:none;}
  .nav-right{gap:10px;}
  .nav-right .btn-primary{padding:10px 14px; font-size:12px;}
  .burger{width:20px;}
}

/* ============ HERO ============ */
.hero{
  min-height:100svh; display:flex; align-items:center; position:relative;
  padding:clamp(120px,20vw,150px) 0 clamp(50px,8vw,80px);
  background:
    radial-gradient(ellipse 900px 500px at 85% 10%, rgba(217,138,68,0.10), transparent 60%),
    var(--bg);
  overflow:hidden;
}
.hero-grid{
  position:absolute; inset:0; opacity:.35; pointer-events:none;
  background-image:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 70% 60% at 60% 30%, black, transparent);
}
.hero .wrap{display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:center; position:relative; z-index:2;}
.hero-copy h1{font-size:clamp(40px,5.2vw,66px); margin-bottom:26px;}
.hero-copy h1 .accent{
  background:linear-gradient(100deg,var(--copper),var(--copper-bright) 60%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-copy p{font-size:17px; color:var(--text-muted); max-width:480px; margin-bottom:36px;}
.hero-ctas{display:flex; gap:16px; margin-bottom:64px; flex-wrap:wrap;}
.hero-stats{display:grid; grid-template-columns:repeat(4,auto); gap:36px;}
.stat b{display:block; font-family:'Space Grotesk',sans-serif; font-size:26px; color:var(--text);}
.stat span{font-size:12px; color:var(--text-faint); font-family:'IBM Plex Mono',monospace; letter-spacing:.02em;}
@media (max-width:820px){ .hero-stats{grid-template-columns:repeat(2,auto);} }

.hero-art{position:relative; aspect-ratio:1/1.05;}
.hero-art svg{width:100%; height:100%;}
.trace{fill:none; stroke:var(--copper-bright); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;
  stroke-dasharray:1400; stroke-dashoffset:1400; animation:draw 2.4s var(--ease) .3s forwards;}
.trace-dim{stroke:var(--line-strong); stroke-dasharray:none; stroke-dashoffset:0; animation:none;}
@keyframes draw{ to{stroke-dashoffset:0;} }
.node-dot{fill:var(--copper-bright); opacity:0; animation:popin .4s var(--ease) forwards;}
@keyframes popin{ to{opacity:1;} }
@media (max-width:920px){ .hero .wrap{grid-template-columns:1fr;} .hero-art{display:none;} }

/* Inner-page hero (smaller, same family) */
.page-hero{
  padding:clamp(120px,16vw,150px) 0 clamp(50px,7vw,70px);
  background:
    radial-gradient(ellipse 800px 420px at 85% 0%, rgba(217,138,68,0.10), transparent 60%),
    var(--bg);
  position:relative; overflow:hidden; border-bottom:1px solid var(--line);
}
.page-hero .hero-grid{opacity:.3;}
.page-hero .wrap{position:relative; z-index:2; max-width:820px;}
.page-hero h1{font-size:clamp(34px,4.4vw,54px); margin-bottom:18px;}
.page-hero h1 .accent{
  background:linear-gradient(100deg,var(--copper),var(--copper-bright) 60%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.page-hero p{font-size:16px; color:var(--text-muted); max-width:560px;}
.breadcrumb{font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-faint); margin-bottom:20px;}
.breadcrumb a:hover{color:var(--copper-bright);}

/* ============ SECTION SHELL ============ */
section{padding:clamp(64px,11vw,130px) 0; position:relative;}
.section-tight{padding:clamp(44px,7vw,80px) 0;}
.section-head{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:64px; flex-wrap:wrap;}
.section-head h2{font-size:clamp(30px,3.4vw,44px); max-width:600px;}
.section-head p{color:var(--text-muted); max-width:380px; font-size:15px;}
.reveal{opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease), transform .8s var(--ease);}
.reveal.in{opacity:1; transform:translateY(0);}

/* ============ ABOUT ============ */
.about{background:var(--bg-alt); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.about .wrap{display:grid; grid-template-columns:.85fr 1.15fr; gap:70px; align-items:center;}
.about-media{position:relative; min-width:0;}
.about-copy{min-width:0;}
.about-media .frame{
  border:1px solid var(--line-strong); padding:14px; position:relative;
}
.about-media img{width:100%; filter:grayscale(.5) sepia(.25) hue-rotate(-8deg) contrast(1.08) brightness(.85); aspect-ratio:4/5; object-fit:cover;}
.about-float{
  position:absolute; bottom:-28px; left:-28px; background:var(--surface); border:1px solid var(--line-strong);
  padding:20px 24px; max-width:220px;
}
.about-float b{font-family:'Space Grotesk',sans-serif; font-size:28px; color:var(--copper-bright); display:block;}
.about-float span{font-size:12.5px; color:var(--text-muted);}
.about-copy h2{font-size:clamp(28px,3.2vw,40px); margin-bottom:22px;}
.about-copy p{color:var(--text-muted); margin-bottom:18px; max-width:560px;}
.badges{display:flex; gap:14px; flex-wrap:wrap; margin-top:32px;}
.badge{
  border:1px solid var(--line-strong); padding:10px 16px; font-family:'IBM Plex Mono',monospace;
  font-size:11.5px; letter-spacing:.06em; color:var(--text-muted); display:flex; align-items:center; gap:8px;
}
.badge::before{content:"⚡"; color:var(--copper);}

/* Values grid (about page) */
.values-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.value-card{border:1px solid var(--line); background:var(--surface); padding:30px 26px;}
.value-card .vnum{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--copper); letter-spacing:.1em; margin-bottom:16px; display:block;}
.value-card h3{font-size:19px; margin-bottom:10px;}
.value-card p{font-size:14px; color:var(--text-muted);}
@media (max-width:920px){
  .about .wrap{grid-template-columns:1fr; gap:56px;}
  .about-media{max-width:100%;}
  .about-float{position:static; margin-top:-40px; margin-left:20px; max-width:none; width:calc(100% - 40px);}
  .values-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:600px){
  .values-grid{grid-template-columns:1fr;}
  .about-float{margin-left:0; width:100%;}
}

/* ============ PROJECTS / SERVICES GRID ============ */
.filters{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:44px;}
.filter-btn{
  background:none; border:1px solid var(--line-strong); color:var(--text-muted);
  padding:9px 18px; font-size:13px; border-radius:20px; transition:all .25s var(--ease);
}
.filter-btn:hover{color:var(--text); border-color:var(--copper);}
.filter-btn.active{background:var(--copper-bright); border-color:var(--copper-bright); color:#0A0D10; font-weight:600;}
.proj-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.proj-card{
  border:1px solid var(--line); background:var(--surface); overflow:hidden; transition:transform .35s var(--ease), border-color .35s;
  display:flex; flex-direction:column; min-width:0;
}
.proj-card:hover{transform:translateY(-6px); border-color:var(--line-strong);}
.proj-media{aspect-ratio:4/3; overflow:hidden; position:relative;}
.proj-media img{width:100%; height:100%; object-fit:cover; filter:grayscale(.45) sepia(.2) hue-rotate(-8deg) contrast(1.1) brightness(.82); transition:transform .6s var(--ease), filter .4s;}
.proj-card:hover .proj-media img{transform:scale(1.06); filter:grayscale(.15) sepia(.12) hue-rotate(-6deg) contrast(1.1) brightness(.92);}
.proj-body{padding:22px 22px 24px;}
.proj-cat{font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.14em; color:var(--copper); text-transform:uppercase; margin-bottom:10px;}
.proj-body h3{font-size:19px; margin-bottom:8px;}
.proj-body p{font-size:14px; color:var(--text-muted); margin-bottom:16px;}
.proj-spec{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--text-faint); border-top:1px solid var(--line); padding-top:14px;}
.hidden-card{display:none;}
@media (max-width:980px){ .proj-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .proj-grid{grid-template-columns:1fr;} }

/* ============ GALLERY ============ */
.gallery{background:var(--bg-alt); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.gal-grid{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:170px; gap:10px;}
.gal-item{position:relative; overflow:hidden; cursor:pointer; border:1px solid var(--line); min-width:0;}
.gal-item img{width:100%; height:100%; object-fit:cover; filter:grayscale(.5) sepia(.2) hue-rotate(-8deg) contrast(1.1) brightness(.8); transition:transform .5s var(--ease), filter .4s;}
.gal-item:hover img{transform:scale(1.08); filter:grayscale(.1) sepia(.1) brightness(.95);}
.gal-item::after{content:"+"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:28px; color:var(--copper-bright); background:rgba(10,13,16,0); opacity:0; transition:all .3s;}
.gal-item:hover::after{opacity:1; background:rgba(10,13,16,.35);}
.gal-item.big{grid-column:span 2; grid-row:span 2;}
@media (max-width:900px){ .gal-grid{grid-template-columns:repeat(2,1fr);} .gal-item.big{grid-column:span 2; grid-row:span 1;} }
@media (max-width:480px){ .gal-grid{grid-auto-rows:130px; gap:8px;} }

/* Lightbox */
.lightbox{position:fixed; inset:0; background:rgba(8,10,12,.94); z-index:200; display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity .3s var(--ease), visibility .3s;}
.lightbox.open{opacity:1; visibility:visible;}
.lightbox img{max-width:82vw; max-height:78vh; object-fit:contain; border:1px solid var(--line-strong);}
.lb-cap{position:absolute; bottom:34px; left:50%; transform:translateX(-50%); font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--text-muted);}
.lb-close, .lb-prev, .lb-next{
  position:absolute; background:none; border:1px solid var(--line-strong); color:var(--text); width:44px; height:44px;
  display:flex; align-items:center; justify-content:center; font-size:18px; transition:all .25s;
}
.lb-close:hover, .lb-prev:hover, .lb-next:hover{border-color:var(--copper-bright); color:var(--copper-bright);}
.lb-close{top:28px; right:34px;}
.lb-prev{left:34px; top:50%; transform:translateY(-50%);}
.lb-next{right:34px; top:50%; transform:translateY(-50%);}
@media (max-width:700px){ .lb-prev,.lb-next{width:36px; height:36px;} .lb-close{top:16px; right:16px;} }

/* ============ CONTACT ============ */
.contact .wrap{display:grid; grid-template-columns:.85fr 1.15fr; gap:70px;}
.contact-info h2{font-size:clamp(28px,3.2vw,40px); margin-bottom:22px;}
.contact-info p{color:var(--text-muted); margin-bottom:34px; max-width:420px;}
.info-row{display:flex; gap:16px; padding:18px 0; border-top:1px solid var(--line);}
.info-row:last-of-type{border-bottom:1px solid var(--line);}
.info-row .ico{color:var(--copper); font-family:'IBM Plex Mono',monospace; font-size:13px; width:26px;}
.info-row b{display:block; font-size:14.5px;}
.info-row span{font-size:13px; color:var(--text-muted);}
.emergency{margin-top:28px; padding:18px 20px; border:1px solid rgba(232,93,79,.4); background:rgba(232,93,79,.06); display:flex; gap:14px; align-items:center;}
.emergency b{color:var(--danger); font-family:'IBM Plex Mono',monospace; font-size:13px;}
.emergency span{font-size:12.5px; color:var(--text-muted);}

.form{background:var(--surface); border:1px solid var(--line); padding:44px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px;}
.field{display:flex; flex-direction:column; gap:8px;}
.field.full{grid-column:1/-1;}
.field label{font-size:12px; font-family:'IBM Plex Mono',monospace; color:var(--text-muted); letter-spacing:.04em;}
.field input, .field select, .field textarea{
  background:var(--bg); border:1px solid var(--line-strong); color:var(--text); padding:13px 14px; font-size:14px;
  font-family:'Inter',sans-serif; transition:border-color .25s;
}
.field textarea{resize:vertical; min-height:100px;}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--copper-bright); outline:none;}
.form .btn-primary{width:100%; justify-content:center; padding:15px; margin-top:6px; font-size:14.5px;}
.form-note{font-size:12px; color:var(--text-faint); margin-top:14px; text-align:center;}
.form-success{display:none; text-align:center; padding:40px 10px;}
.form-success.show{display:block;}
.form-success .tick{width:52px; height:52px; border:1px solid var(--copper-bright); border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 20px; color:var(--copper-bright); font-size:22px;}
@media (max-width:820px){ .contact .wrap{grid-template-columns:1fr;} .form-row{grid-template-columns:1fr;} .form{padding:28px;} }

/* ============ CTA BANNER ============ */
.cta-banner{
  border:1px solid var(--line-strong); background:var(--surface);
  padding:clamp(30px,5vw,54px); display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:24px;
  position:relative; overflow:hidden;
}
.cta-banner::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:radial-gradient(circle at 90% 10%, rgba(79,179,255,0.10), transparent 55%), radial-gradient(circle at 5% 100%, rgba(217,138,68,0.14), transparent 55%);
}
.cta-banner > *{position:relative; z-index:1;}
.cta-banner h2{font-size:clamp(22px,2.6vw,32px); margin-bottom:8px;}
.cta-banner p{color:var(--text-muted); font-size:14.5px;}

/* ============ LEGAL CONTENT (privacy / terms) ============ */
.legal-content{max-width:760px;}
.legal-content h2{font-size:22px; margin-top:44px; margin-bottom:14px;}
.legal-content h2:first-child{margin-top:0;}
.legal-content p{color:var(--text-muted); font-size:15px; margin-bottom:14px; max-width:none;}
.legal-content ul{margin:14px 0 14px 0; display:flex; flex-direction:column; gap:8px;}
.legal-content li{
  color:var(--text-muted); font-size:14.5px; padding-left:20px; position:relative;
}
.legal-content li::before{content:"—"; position:absolute; left:0; color:var(--copper);}
.legal-content a{color:var(--copper-bright); border-bottom:1px solid var(--copper-dim);}
.legal-updated{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--text-faint); letter-spacing:.08em; text-transform:uppercase; margin-bottom:40px; display:block;}

/* ============ PREMIUM FOOTER ============ */
.premium-footer {
  background-color: var(--bg, #0E1216);
  color: var(--text-muted, #9CA3AF);
  padding: 80px 0 40px 0;
  border-top: 1px solid var(--line-strong, rgba(237, 234, 227, 0.08));
  font-family: 'Space Grotesk', sans-serif;
}

/* Container de lățime maximă adaptat din stilurile tale */
.premium-footer .wrap {
  width: min(90vw, 1200px);
  margin: 0 auto;
}

/* Grid-ul principal (Responsiv nativ fără media queries agresive) */
.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1.2fr;
  gap: 60px;
  align-items: start;
}

/* Coloana cu Brandul & Logo-ul */
.footer-brand {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Blocăm deformarea logo-ului în footer */
.premium-footer .logo-flex {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  cursor: pointer;
  padding: 0;
  width: fit-content;
}

.premium-footer .logo-flex .name {
  font-size: 18px;
  font-weight: 700;
  color: var(--text, #EDEAE3);
  letter-spacing: 0.05em;
}

.premium-footer .logo-flex .name span {
  color: var(--copper, #D98A44);
}

.premium-footer .logo-flex .sub {
  font-size: 10px;
  color: var(--text-faint, rgba(237, 234, 227, 0.5));
  letter-spacing: 0.1em;
}

.brand-tagline {
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-muted, rgba(237, 234, 227, 0.65));
  max-width: 320px;
}

/* Coloane standard */
.footer-col {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.col-title {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--text, #EDEAE3);
  font-weight: 600;
  margin: 0;
}

/* Liste de link-uri premium */
.footer-links, .footer-contact-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-links a, .contact-item {
  font-size: 14px;
  color: var(--text-muted, rgba(237, 234, 227, 0.65));
  text-decoration: none;
  transition: color 0.3s var(--ease, ease), transform 0.3s var(--ease, ease);
  display: inline-flex;
  align-items: center;
  width: fit-content;
}

/* Efect hover premium pe link-uri (fără să deplaseze restul elementelor) */
.footer-links a:hover, .contact-item:hover {
  color: var(--copper-bright, #F2A93C);
  transform: translate3d(3px, 0, 0);
}

.contact-item {
  gap: 10px;
}

.contact-item .icon {
  color: var(--copper, #D98A44);
  font-weight: bold;
}

/* Evidențiere WhatsApp */
.contact-item.whatsapp-link:hover .icon {
  color: #25D366;
  filter: drop-shadow(0 0 4px rgba(37, 211, 102, 0.4));
}

/* Separator orizontal fin */
.footer-divider {
  border: 0;
  height: 1px;
  background: rgba(237, 234, 227, 0.08);
  margin: 60px 0 30px 0;
}

/* ============ SUB-FOOTER (LEGAL & COP) ============ */
.premium-footer .foot-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  color: var(--text-faint, rgba(237, 234, 227, 0.4));
  gap: 20px;
  flex-wrap: wrap;
}

.legal-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.reg-details {
  font-size: 11px;
  opacity: 0.8;
}

.legal-links {
  display: flex;
  align-items: center;
  gap: 8px;
}

.legal-links a {
  color: var(--text-faint, rgba(237, 234, 227, 0.4));
  text-decoration: none;
  transition: color 0.3s ease;
}

.legal-links a:hover {
  color: var(--text, #EDEAE3);
}

.legal-links .sep {
  user-select: none;
}

/* Domain branding accentuat cu glow fin copper */
.domain-brand {
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text, #EDEAE3);
  font-size: 11px;
  transition: color 0.3s ease;
}

.premium-footer:hover .domain-brand {
  color: var(--copper-bright, #F2A93C);
}

/* ============ MEDIA QUERIES (FLUIDITATE PERFECTĂ) ============ */

/* Tablete */
@media (max-width: 900px) {
  .footer-grid {
    grid-template-columns: 1.5fr 1fr;
    gap: 40px;
  }
  .footer-brand {
    grid-column: span 2; /* Brandul ia toată lățimea sus */
    border-bottom: 1px solid rgba(237, 234, 227, 0.04);
    padding-bottom: 30px;
  }
  .brand-tagline {
    max-width: 100%;
  }
}

/* Telefoane mobile */
@media (max-width: 600px) {
  .premium-footer {
    padding: 60px 0 30px 0;
  }
  .footer-grid {
    grid-template-columns: 1fr; /* Toate pe o singură coloană ordonată */
    gap: 35px;
  }
  .footer-brand {
    grid-column: span 1;
  }
  .footer-divider {
    margin: 40px 0 24px 0;
  }
  .premium-footer .foot-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }
  .legal-links {
    flex-wrap: wrap;
    gap: 10px;
  }
}

/* ============ WHATSAPP FAB (POZIȚIONAT JOS) ============ */
.wa-fab {
  position: fixed; 
  right: 24px; /* Aliniat la fix 24px, la fel ca butonul de social */
  bottom: 24px; /* Lipit de marginea de jos */
  z-index: 9998; /* Z-index ridicat pentru a rămâne mereu deasupra */
  width: 54px; 
  height: 54px; 
  border-radius: 50%; 
  background: #1E9E63; 
  color: #fff;
  display: flex; 
  align-items: center; 
  justify-content: center; 
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45);
  border: 1px solid rgba(255, 255, 255, .14); 
  transition: transform .3s cubic-bezier(0.23, 1, 0.32, 1), background-color 0.3s ease;
}

.wa-fab:hover {
  transform: translateY(-3px) scale(1.05);
  background: #158350; /* Culoare o idee mai închisă la hover */
}

.wa-fab svg {
  width: 26px; 
  height: 26px;
}

/* ===== SOCIAL FAB (MUTAT EXACT DEASUPRA WHATSAPP) ===== */
.social-fab {
  position: fixed;
  bottom: 92px; /* Poziționat la exact 92px ca să se așeze perfect deasupra celui de WhatsApp */
  right: 23px; /* Corelat perfect cu lățimea butonului de WhatsApp pentru o aliniere simetrică la milimetru */
  z-index: 9999; /* Z-index mai mare pentru ca meniul extins să treacă peste cel de WhatsApp dacă e cazul */
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: 14px;
}

/* ============ AJUSTĂRI PENTRU ECOANE DE MOBIL ============ */
@media (max-width: 768px) {
  .wa-fab {
    right: 16px; /* Aliniat la 16px pe mobil */
    bottom: 16px;
    width: 48px; /* Puțin mai mic pe mobil */
    height: 48px;
  }
  
  .wa-fab svg {
    width: 22px;
    height: 22px;
  }

  .social-fab {
    bottom: 78px; /* Coborât și el corespunzător pe mobil deasupra WhatsApp-ului mai mic */
    right: 14px; /* Centrat perfect deasupra pe mobil */
    gap: 12px;
  }
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important; transition-duration:.01ms !important;}
}

/* ============ DELIMITATOR ȘI STIL FILTRARE ACTIVE ============ */

/* Elimină marginea sau padding-ul excesiv dacă stilurile vechi intrau în conflict */
.services-section {
  padding-bottom: 20px;
}

/* Delimitatorul vizual (stil minimal grafit/cupru) */
.services-separator {
  padding: 40px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.separator-line {
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--line-strong) 20%, var(--line-strong) 80%, transparent);
  position: relative;
}

/* Un mic nod decorativ din cupru în centrul separatorului (specific identității site-ului) */
.separator-line::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 6px;
  height: 6px;
  background: var(--copper);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--copper-bright);
}

/* Se asigură că elementele ascunse din filtre dispar corect vizual */
.services-modern-grid .proj-card.hidden-card {
  display: none !important;
}

/* Grid adaptat pentru utilizarea clasei duale .service-card.proj-card */
.services-modern-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  margin-top: 40px;
}

.service-card {
  background: var(--surface);
  border: 1px solid var(--line);
  padding: clamp(24px, 4vw, 40px);
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  transition: transform 0.4s var(--ease), border-color 0.4s var(--ease), box-shadow 0.4s var(--ease);
  position: relative;
}

.service-card:hover {
  transform: translateY(-4px);
  border-color: var(--line-strong);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
}

.service-header {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.service-card .icon-wrap {
  width: 52px;
  height: 52px;
  background: rgba(217, 138, 68, 0.08);
  border: 1px solid rgba(217, 138, 68, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius);
  color: var(--copper-bright);
  transition: background 0.3s var(--ease), border-color 0.3s var(--ease);
}

.service-card:hover .icon-wrap {
  background: rgba(217, 138, 68, 0.16);
  border-color: var(--copper-bright);
}

.service-card .icon {
  width: 24px;
  height: 24px;
  stroke: var(--copper-bright);
}

.service-card h3 {
  font-size: clamp(22px, 3vw, 28px);
  color: var(--text);
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.service-card p {
  font-size: 15px;
  color: var(--text-muted);
  line-height: 1.6;
}

.subservice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px;
  border-top: 1px solid var(--line);
  padding-top: 24px;
}

.subservice-grid h4 {
  font-size: 13px;
  font-family: 'IBM Plex Mono', monospace;
  color: var(--copper);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 16px;
}

.trace-list {
  list-style: none;
  display: grid;
  gap: 10px;
}

.trace-list li {
  font-size: 14.5px;
  color: var(--text-muted);
  padding-left: 18px;
  position: relative;
  transition: color 0.25s;
}

.trace-list li::before {
  content: "⚡";
  position: absolute;
  left: 0;
  top: 1px;
  font-size: 10px;
  color: var(--copper);
}

.service-card:hover .trace-list li {
  color: var(--text);
}

@media (min-width: 820px) {
  .service-card {
    grid-template-columns: 1fr 1.2fr;
    align-items: start;
  }
  
  .subservice-grid {
    border-top: none;
    padding-top: 0;
    border-left: 1px solid var(--line);
    padding-left: 32px;
  }
}

/* ============ ABOUT PAGE: OPTIMISED NEW LAYOUTS ============ */

/* Layout general asimetric poveste/misiune */
.about-story-section {
  background: var(--bg);
  padding: clamp(60px, 8vw, 100px) 0;
}

.about-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
}

.story-content h2 {
  font-size: clamp(28px, 4vw, 42px);
  color: var(--text);
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  line-height: 1.15;
  margin: 12px 0 24px;
  letter-spacing: -0.02em;
}

.story-content p {
  font-size: 16px;
  color: var(--text-muted);
  line-height: 1.7;
  margin-bottom: 20px;
}

.story-highlight {
  border-left: 2px solid var(--copper);
  padding-left: 20px;
  margin-top: 28px;
}

.story-highlight strong {
  font-size: 17px;
  color: var(--text);
  font-weight: 600;
}

/* Cardul "Why Choose Us" minimalist (Grafit + Cupru) */
.card-ink-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}

.card-ink {
  background: var(--surface);
  border: 1px solid var(--line);
  padding: clamp(30px, 5vw, 48px);
  border-radius: var(--radius, 8px);
  position: relative;
  width: 100%;
  max-width: 550px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
}

.card-ink::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, var(--copper), var(--copper-bright, #F2A93C));
}

.card-ink-badge {
  display: inline-block;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  color: var(--copper-bright, #F2A93C);
  background: rgba(242, 169, 60, 0.08);
  border: 1px solid rgba(242, 169, 60, 0.2);
  padding: 4px 12px;
  border-radius: 100px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 24px;
}

/* Lista decorată cu simbolul fulgerului din cupru */
.card-ink .trace-list {
  list-style: none;
  display: grid;
  gap: 18px;
}

.card-ink .trace-list li {
  font-size: 15.5px;
  color: var(--text-muted);
  padding-left: 24px;
  position: relative;
  line-height: 1.5;
}

.card-ink .trace-list li strong {
  color: var(--text);
}

.card-ink .trace-list li::before {
  content: "⚡";
  position: absolute;
  left: 0;
  top: 2px;
  font-size: 12px;
  color: var(--copper-bright, #F2A93C);
}

/* Divider-ul electric din mijloc */
.trace-divider {
  display: block;
  width: 100%;
  height: 60px;
  background: var(--bg);
  overflow: visible;
}

/* Secțiunea Valori Coapse (Grid-ul de 3) */
.core-values-section {
  padding: clamp(60px, 8vw, 100px) 0;
}

.values-modern-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  margin-top: 48px;
}

.value-card-alt {
  background: var(--surface);
  border: 1px solid var(--line);
  padding: 40px 32px;
  border-radius: var(--radius, 8px);
  transition: transform 0.4s var(--ease, ease), border-color 0.4s var(--ease, ease), box-shadow 0.4s var(--ease, ease);
}

.value-card-alt:hover {
  transform: translateY(-6px);
  border-color: var(--line-strong);
  box-shadow: 0 15px 35px rgba(0,0,0,0.3);
}

.value-card-alt .icon-wrap {
  width: 48px;
  height: 48px;
  background: rgba(217, 138, 68, 0.08);
  border: 1px solid rgba(217, 138, 68, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  color: var(--copper-bright, #F2A93C);
  margin-bottom: 24px;
}

.value-card-alt h3 {
  font-size: 22px;
  font-family: 'Space Grotesk', sans-serif;
  color: var(--text);
  font-weight: 600;
  margin-bottom: 12px;
}

.value-card-alt p {
  font-size: 15px;
  color: var(--text-muted);
  line-height: 1.6;
}

/* Secțiunea de Certificări */
.cert-section {
  background: var(--bg);
  padding: clamp(60px, 8vw, 100px) 0;
}

.cert-strip-modern {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 48px;
  align-items: center;
  justify-content: center;
}

.cert-badge-alt {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: var(--surface);
  border: 1px solid var(--line);
  padding: 16px 28px;
  border-radius: var(--radius, 8px);
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 500;
  font-size: 15px;
  color: var(--text);
  width: 100%;
  max-width: 320px;
  justify-content: center;
  transition: border-color 0.3s;
}

.cert-badge-alt:hover {
  border-color: var(--copper);
}

.cert-badge-alt .icon {
  width: 20px;
  height: 20px;
  color: var(--copper-bright, #F2A93C);
  flex-shrink: 0;
}

/* ============ MEDIA QUERIES (DESKTOP OPTIMISATIONS) ============ */
@media (min-width: 768px) {
  .cert-strip-modern {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 24px;
  }
  
  .cert-badge-alt {
    width: auto;
  }
}

@media (min-width: 992px) {
  .about-grid {
    grid-template-columns: 1.2fr 1fr;
    gap: 80px;
  }
  
  .values-modern-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
  }
}
/* ============ GALERIE PORTOFOLIU OPTIMIZATĂ ============ */

.gallery-section {
  padding: clamp(40px, 6vw, 80px) 0;
  background: var(--bg);
}

/* Grilă super-fluidă bazată pe auto-fit */
.projects-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px;
}

@media(min-width: 768px) {
  .projects-grid {
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 24px;
  }
}

/* Structura itemilor din galerie */
.projects-grid .gal-item {
  cursor: pointer;
  border-radius: var(--radius, 8px);
  overflow: hidden;
  position: relative;
  border: 1px solid var(--line);
  background: var(--surface);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), 
              border-color 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Wrapper-ul imaginii */
.project-img-container {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1; /* Păstrează imaginile pătrate perfecte și aliniate */
  overflow: hidden;
}

.project-img-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Overlay întunecat premium cu tentă de grafit */
.project-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(10, 13, 16, 0.95) 0%,
    rgba(10, 13, 16, 0.6) 60%,
    rgba(10, 13, 16, 0.1) 100%
  );
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 24px;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1), 
              transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Badge (eticheta proiectului deasupra titlului) */
.project-tag {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  text-transform: uppercase;
  color: var(--copper-bright, #F2A93C);
  letter-spacing: 0.1em;
  margin-bottom: 8px;
}

/* Titlul lucrării */
.project-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 6px 0;
  line-height: 1.3;
}

/* Locația */
.project-location {
  font-size: 14px;
  color: var(--text-muted);
  font-weight: 400;
}

/* ============ INTERACȚIUNE ȘI HOVER (FLUIDĂ ȘI PE DESKTOP ȘI PE MOBIL) ============ */

/* Hover pe Desktop */
@media (hover: hover) {
  .projects-grid .gal-item:hover {
    transform: translateY(-6px);
    border-color: var(--copper);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
  }

  .projects-grid .gal-item:hover .project-img-container img {
    transform: scale(1.06);
  }

  .projects-grid .gal-item:hover .project-overlay {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Comportament pentru Mobile/Touch (unde hover-ul clasic nu există) */
@media (hover: none) {
  /* Overlay-ul este ușor vizibil permanent în partea de jos ca textul să fie citibil nativ */
  .project-overlay {
    opacity: 1;
    transform: translateY(0);
    background: linear-gradient(
      to top,
      rgba(10, 13, 16, 0.9) 0%,
      rgba(10, 13, 16, 0.4) 70%,
      transparent 100%
    );
    padding: 16px;
  }
  
  .project-title {
    font-size: 16px;
  }
  
  .projects-grid .gal-item {
    border-color: rgba(237, 234, 227, 0.15);
  }
}

/* Stiluri Corectate pentru a preveni conflictele cu style.css */
  .services-section-custom { 
    padding: 100px 0; 
    background-color: #0A0D10; 
  }
  .services-custom-grid { 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); 
    gap: 30px; 
    margin-top: 50px; 
  }
  .service-card-custom { 
    background: var(--bg-card); 
    padding: 40px 30px; 
    border-radius: 16px; 
    border: 1px solid var(--border-color); 
    transition: var(--transition); 
    position: relative; 
    overflow: hidden; 
  }
  .service-card-custom:hover { 
    transform: translateY(-5px); 
    border-color: var(--primary); 
  }
  .service-card-custom h3 { 
    font-family: 'Space Grotesk', sans-serif; 
    font-size: 1.4rem; 
    margin-bottom: 16px; 
    color: #fff; 
  }
  .service-card-custom p { 
    color: var(--text-muted); 
    font-size: 0.98rem; 
    line-height: 1.6; 
  }
  
  /* Corecție pentru grid-ul de About */
  .about-wrapper { 
    display: grid; 
    grid-template-columns: 1.1fr 0.9fr; 
    gap: 60px; 
    margin-top: 40px; 
    align-items: start; 
  }
  @media (max-width: 991px) {
    .about-wrapper { 
      grid-template-columns: 1fr; 
      gap: 40px; 
    }
    .services-custom-grid {
      grid-template-columns: 1fr;
    }
  }
  
/* ==========================================
     COMMITMENT SECTION (FIXED)
     ========================================== */
  .commitment-section-fixed {
    padding: 100px 0;
    background-color: #0d1117;
    border-top: 1px solid var(--border-color);
  }
  .commitment-grid-fixed {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 60px;
    align-items: center;
  }
  .commitment-content-fixed h2 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(28px, 3.5vw, 42px);
    line-height: 1.2;
    margin: 15px 0 25px 0;
    color: #ffffff;
  }
  .commitment-badge-fixed {
    background: rgba(245, 158, 11, 0.1);
    color: #f59e0b;
    padding: 6px 14px;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    display: inline-block;
  }
  .commitment-content-fixed p {
    color: var(--text-muted);
    font-size: 1.05rem;
    line-height: 1.7;
    margin-bottom: 20px;
  }
  .commitment-image-fixed {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
  .commitment-stats-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    padding: 40px 20px;
    border-radius: 16px;
    text-align: center;
    transition: var(--transition);
  }
  .commitment-stats-card:hover {
    border-color: var(--primary);
    transform: translateY(-5px);
  }
  .commitment-stats-card h3 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 2.5rem;
    color: var(--primary);
    margin-bottom: 10px;
  }
  .commitment-stats-card p {
    font-size: 0.9rem;
    color: var(--text-muted);
    line-height: 1.4;
    margin: 0;
  }

  /* ==========================================
     MAP CONTAINER FIXED FORCE
     ========================================== */
  .map-container-fixed iframe {
    max-height: none !important;
    max-width: none !important;
  }

  /* Responsivitate pentru ecrane mici */
  @media (max-width: 991px) {
    .commitment-grid-fixed {
      grid-template-columns: 1fr;
      gap: 40px;
    }
    .commitment-section-fixed {
      padding: 60px 0;
    }
  }
  @media (max-width: 480px) {
    .commitment-image-fixed {
      grid-template-columns: 1fr;
    }
  }
/* ==========================================
     CONTAINER MAP INDUSTRIAL-STRENGTH (FLUID)
     ========================================== */
  .map-wrapper-fluid {
    width: 100%;
    max-width: 100%;
    background-color: #0A0D10;
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    display: block !important;
  }

  /* Box-ul care forțează un raport de aspect de tip 16:9 sau înălțime fixă controlată */
  .map-aspect-box {
    position: relative !important;
    width: 100% !important;
    height: 0 !important;
    /* Creează o înălțime fluidă proporțională cu lățimea ecranului (45% din lățime) */
    padding-bottom: 45% !important; 
    overflow: hidden !important;
    display: block !important;
  }

  /* Targetăm iframe-ul extrem de specific pentru a distruge orice regulă din style.css */
  .map-aspect-box iframe,
  section.map-wrapper-fluid .map-aspect-box iframe[src*="google.com/maps"] {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    /* Efectul tău de mod întunecat */
    filter: grayscale(1) invert(0.92) contrast(1.1) !important;
    -webkit-filter: grayscale(1) invert(0.92) contrast(1.1) !important;
  }

  /* Pe telefoane mobile, vrem ca harta să fie puțin mai înaltă ca să poți naviga ușor pe ea */
  @media (max-width: 767px) {
    .map-aspect-box {
      /* Creștem padding-ul de jos pentru a face harta mai „pătrată” pe mobil (raport 4:3 sau similar) */
      padding-bottom: 70% !important; 
    }
  }
 /* ==========================================
     BLOCARE TOTALĂ DEFORMARE GOOGLE MAP
     ========================================== */
  .map-section-isolated {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important; /* Taie absolut orice iese în afară */
    display: block !important;
    clear: both !important;
    box-sizing: border-box !important;
    background-color: #0A0D10;
  }

  .map-container-isolated {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 450px !important; /* Înălțime fixă pe desktop, fără procente buclucașe */
    overflow: hidden !important;
    display: block !important;
    box-sizing: border-box !important;
  }

  /* Reset total și agresiv pe iframe ca să ignore style.css */
  .map-container-isolated iframe {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    /* Efectul tău de Dark Mode */
    filter: grayscale(1) invert(0.92) contrast(1.1) !important;
    -webkit-filter: grayscale(1) invert(0.92) contrast(1.1) !important;
  }

  /* Micșorăm înălțimea pe mobil ca să nu ocupe tot ecranul pe verticală */
  @media (max-width: 768px) {
    .map-container-isolated {
      height: 320px !important; 
    }
  }
/* ==========================================
     HARTĂ INTEGRATĂ ÎN CHENAR (CARD DESIGN)
     ========================================== */
  .map-section-integrated {
    padding: 80px 0;
    background-color: #0A0D10; /* Fundalul închis al site-ului */
  }

  /* Chenarul principal care protejează harta și o aliniază în pagină */
  .map-card-frame {
    background: var(--bg-card, #161b22);
    border: 1px solid var(--border-color, #30363d);
    border-radius: 20px;
    padding: 24px; /* Spațiul dintre hartă și marginea chenarului */
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
  }

  /* Containerul intern al iframe-ului */
  .map-iframe-holder {
    position: relative;
    width: 100%;
    height: 400px; /* Înălțimea fixă a hărții pe desktop */
    border-radius: 12px; /* Colțuri rotunjite pentru hartă */
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.05);
  }

  /* Forțăm iframe-ul să stea DOAR în interiorul chenarului */
  .map-iframe-holder iframe {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    /* Efectul tău de Dark Mode pentru Google Maps */
    filter: grayscale(1) invert(0.92) contrast(1.1) !important;
    -webkit-filter: grayscale(1) invert(0.92) contrast(1.1) !important;
  }

  /* Optimizare mobil pentru chenar */
  @media (max-width: 768px) {
    .map-section-integrated {
      padding: 50px 0;
    }
    .map-card-frame {
      padding: 12px; /* Reducem chenarul pe ecrane mici */
      border-radius: 16px;
    }
    .map-iframe-holder {
      height: 300px; /* Înălțime mai mică pe mobil ca să fie ușor de navigat */
    }
  }
/* Containerul Dividerului */
  .electro-divider-container {
    width: 100%;
    background-color: #0A0D10; /* Fundalul închis al site-ului */
    padding: 30px 0;
    overflow: hidden;
    position: relative;
  }

  .electro-divider {
    width: 100%;
    height: 80px;
    display: block;
  }

  /* Animația impulsului galben cu variație fluidă de viteză */
  .electro-active-yellow {
    stroke-dasharray: 160, 1500;
    stroke-dashoffset: 1660;
    animation: yellowAlternatingCurrent 4.5s cubic-bezier(0.4, 0, 0.2, 1) infinite;
  }

  /* Efectul de scânteie / flicker galben */
  .spark-node-yellow {
    transform-origin: center;
    animation: yellowSparkFlicker 0.6s ease-in-out infinite alternate;
  }

  /* ANIMATII CSS */
  @keyframes yellowAlternatingCurrent {
    0% {
      stroke-dashoffset: 1660;
    }
    100% {
      stroke-dashoffset: 0;
    }
  }

  @keyframes yellowSparkFlicker {
    0% {
      opacity: 0.4;
      transform: scale(0.85);
      fill: #FFD000;
    }
    100% {
      opacity: 1;
      transform: scale(1.4);
      fill: #FFFFFF;
    }
  }
/* ===== SOCIAL FAB (Facebook / TikTok / Google Maps) - MUTAT ÎN DREAPTA & OPTIMIZAT ===== */
.social-fab {
  position: fixed;
  bottom: 90px;
  right: 24px; /* Mutat complet pe dreapta */
  z-index: 9998;
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: 14px;
}

.sf-menu {
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: 14px;
}

.sf-btn {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5);
  opacity: 0;
  transform: translateY(16px) scale(0.6);
  pointer-events: none;
  transition: opacity 0.25s ease, transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  border: 1px solid rgba(255, 255, 255, 0.08); /* Bordură fină pentru stilul premium */
}

.sf-btn svg {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
}

/* Culori adaptate și integrate */
.sf-fb {
  background: #1877F2;
  color: #fff;
}

.sf-tiktok {
  background: var(--bg-card, #161b22);
  color: #fff;
  border: 1px solid var(--primary, #F2A93C); /* Bordură de cupru/galben pentru TikTok */
}

.sf-maps {
  background: linear-gradient(135deg, #EA4335, #34A853);
  color: #fff;
}

/* Animație la deschidere */
.social-fab.open .sf-btn {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.social-fab.open .sf-menu .sf-btn:nth-child(1) { transition-delay: 0.02s; }
.social-fab.open .sf-menu .sf-btn:nth-child(2) { transition-delay: 0.07s; }
.social-fab.open .sf-menu .sf-btn:nth-child(3) { transition-delay: 0.12s; }

/* Butonul principal de Toggle (Galben Electric / Cupru) */
.sf-toggle {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.1);
  cursor: pointer;
  flex-shrink: 0;
  background: var(--primary, #F2A93C); /* Folosește galbenul tău de bază */
  color: #0A0D10; /* Text/Iconiță închisă la culoare pentru contrast maxim */
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 22px rgba(242, 169, 60, 0.4);
  transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  position: relative;
}

.sf-toggle:hover {
  background: var(--copper-bright, #FFD000);
  transform: translateY(-3px);
  box-shadow: 0 10px 28px rgba(242, 169, 60, 0.6);
}

.sf-toggle:active {
  transform: scale(0.95);
}

.sf-toggle svg {
  width: 24px;
  height: 24px;
  position: absolute;
  transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
}

.sf-icon-open {
  opacity: 1;
  transform: rotate(0deg) scale(1);
}

.sf-icon-close {
  opacity: 0;
  transform: rotate(-45deg) scale(0.5);
}

/* Stările când meniul este deschis */
.social-fab.open .sf-icon-open {
  opacity: 0;
  transform: rotate(45deg) scale(0.5);
}

.social-fab.open .sf-icon-close {
  opacity: 1;
  transform: rotate(0deg) scale(1);
}

/* Adaptare perfectă pentru telefoane (Mobile) */
@media (max-width: 768px) {
  .social-fab {
    bottom: 80px; /* Ridicat puțin ca să nu se suprapună cu eventualele bare de navigare de pe mobil */
    right: 16px; /* Aliniat la 16px de marginea dreaptă */
    gap: 12px;
  }
  
  .sf-menu {
    gap: 12px;
  }

  .sf-btn {
    width: 44px;
    height: 44px;
  }

  .sf-btn svg {
    width: 20px;
    height: 20px;
  }

  .sf-toggle {
    width: 52px;
    height: 52px;
  }
}
/* ===== BUTON PAGE UP (MUTAT MAI LA DREAPTA FAȚĂ DE MARGINE) ===== */
.page-up-btn {
  position: fixed;
  bottom: 90px;
  left: 45px;   /* Am mărit distanța ca să fie împins mai la dreapta */
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: var(--bg-card, #161b22);
  border: 1px solid var(--border-color, #30363d);
  color: var(--primary, #F2A93C);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  
  /* Stare inițială ascunsă */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(15px) scale(0.8);
  
  transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5);
}

.page-up-btn svg {
  width: 20px;
  height: 20px;
  pointer-events: none;
  transition: transform 0.3s ease;
}

/* Clasa activă */
.page-up-btn.show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

/* Hover & Active */
.page-up-btn:hover {
  background-color: var(--primary, #F2A93C);
  color: #0A0D10;
  border-color: var(--primary, #F2A93C);
  box-shadow: 0 8px 24px rgba(242, 169, 60, 0.4);
  transform: translateY(-4px);
}

.page-up-btn:hover svg {
  transform: translateY(-2px);
}

.page-up-btn:active {
  transform: translateY(-1px) scale(0.95);
}

/* Mobil */
@media (max-width: 768px) {
  .page-up-btn {
    bottom: 80px;
    left: 24px; /* Ajustat și pe mobil mai la dreapta */
    width: 44px;
    height: 44px;
  }
  .page-up-btn svg {
    width: 18px;
    height: 18px;
  }
}

body.menu-locked {
  overflow: hidden !important;
}
/* Fundal solid la scroll pe header */
header.scrolled,
#siteHeader.scrolled,
.site-header.scrolled {
  background-color: #0A0D10 !important; /* Negru intens opac */
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  transition: background-color 0.3s ease !important;
}
/* ============ PREMIUM SEO SECTION ============ */
.seo-text-premium {
  padding: 100px 0;
  background-color: var(--surface-1, #13171C); /* Fundal discret diferit pentru a segmenta pagina */
  border-top: 1px solid var(--line-strong, rgba(237, 234, 227, 0.05));
  border-bottom: 1px solid var(--line-strong, rgba(237, 234, 227, 0.05));
}

.seo-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 80px;
  align-items: start;
}

/* Coloana Stângă */
.seo-brand-side {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.seo-brand-side h2 {
  font-size: clamp(28px, 4vw, 38px);
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  line-height: 1.2;
  color: var(--text, #EDEAE3);
  margin: 0;
}

.seo-brand-side h2 .accent {
  color: var(--copper-bright, #F2A93C);
}

/* Badge-uri de încredere (E-E-A-T) */
.seo-trust-badges {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 15px;
}

.trust-badge {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.trust-badge .badge-icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(217, 138, 68, 0.1);
  color: var(--copper-bright, #F2A93C);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: bold;
  flex-shrink: 0;
  border: 1px solid rgba(217, 138, 68, 0.15);
}

.trust-badge strong {
  display: block;
  font-size: 14px;
  color: var(--text, #EDEAE3);
  margin-bottom: 4px;
}

.trust-badge span {
  font-size: 13px;
  color: var(--text-muted, #9CA3AF);
  line-height: 1.4;
}

/* Coloana Dreaptă */
.seo-content-side {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.seo-content-side p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-muted, rgba(237, 234, 227, 0.75));
  margin: 0;
}

.seo-content-side strong {
  color: var(--text, #EDEAE3);
  font-weight: 600;
}

/* Tag-uri tematice */
.seo-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 15px;
}

.seo-tags span {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  color: var(--text-faint, rgba(237, 234, 227, 0.4));
  background: rgba(237, 234, 227, 0.03);
  padding: 4px 10px;
  border-radius: 4px;
  border: 1px solid rgba(237, 234, 227, 0.05);
}

/* ============ MEDIAS (FLUIDITATE DE PE ORICE ECRAN) ============ */
@media (max-width: 1024px) {
  .seo-grid {
    gap: 50px;
  }
}

@media (max-width: 850px) {
  .seo-text-premium {
    padding: 70px 0;
  }
  .seo-grid {
    grid-template-columns: 1fr; /* Cade elegant pe un singur rând pe tabletă/mobil */
    gap: 40px;
  }
  .seo-brand-side {
    border-bottom: 1px solid rgba(237, 234, 227, 0.05);
    padding-bottom: 30px;
  }
}

/* ============ PREMIUM COMMITMENT SECTION ============ */
.commitment-section-premium {
  padding: 120px 0;
  background-color: var(--bg, #0E1216);
  position: relative;
  overflow: hidden;
}

.commitment-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 80px;
  align-items: center;
}

/* Coloana din stânga - Text */
.commitment-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}

.commitment-badge {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--copper-bright, #F2A93C);
  background: rgba(217, 138, 68, 0.1);
  padding: 6px 14px;
  border-radius: 100px;
  border: 1px solid rgba(217, 138, 68, 0.15);
  font-weight: 500;
}

.commitment-content h2 {
  font-size: clamp(32px, 4.5vw, 44px);
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  line-height: 1.15;
  color: var(--text, #EDEAE3);
  margin: 0;
}

.commitment-content h2 .accent {
  color: var(--copper-bright, #F2A93C);
}

.commitment-paragraphs {
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin-top: 10px;
}

.commitment-paragraphs p {
  font-size: 16px;
  line-height: 1.7;
  color: var(--text-muted, #9CA3AF);
  margin: 0;
}

.commitment-paragraphs strong {
  color: var(--text, #EDEAE3);
  font-weight: 600;
}

/* Coloana din dreapta - Carduri Stats premium */
.commitment-stats-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  position: relative;
}

/* Stilul Premium pentru Cardurile Electronice */
.stat-card-premium {
  position: relative;
  background: var(--surface-1, #13171C);
  border: 1px solid var(--line-strong, rgba(237, 234, 227, 0.06));
  border-radius: 12px;
  padding: 32px 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow: hidden;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), 
              border-color 0.4s ease, 
              box-shadow 0.4s ease;
}

/* Efect de glow fin în fundalul cardului */
.stat-glow {
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(217,138,68,0.03) 0%, transparent 60%);
  pointer-events: none;
  transition: opacity 0.4s ease;
}

.stat-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.stat-number {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(28px, 3.5vw, 36px);
  color: var(--text, #EDEAE3);
  line-height: 1;
}

/* Punctul luminos / Indicatorul LED */
.stat-indicator {
  width: 6px;
  height: 6px;
  background-color: var(--line-strong, rgba(237, 234, 227, 0.3));
  border-radius: 50%;
  transition: background-color 0.4s ease, box-shadow 0.4s ease;
}

.stat-indicator.pulse {
  background-color: var(--copper-bright, #F2A93C);
  box-shadow: 0 0 8px var(--copper-bright, #F2A93C);
  animation: ledPulse 2s infinite alternate;
}

.stat-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--text, #EDEAE3);
  margin: 0;
}

.stat-desc {
  font-size: 13px;
  line-height: 1.5;
  color: var(--text-faint, rgba(237, 234, 227, 0.5));
  margin: 0;
}

/* HOVER EFFECTS */
.stat-card-premium:hover {
  transform: translateY(-6px);
  border-color: rgba(217, 138, 68, 0.25);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2), 
              inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.stat-card-premium:hover .stat-indicator {
  background-color: var(--copper-bright, #F2A93C);
  box-shadow: 0 0 10px var(--copper-bright, #F2A93C);
}

.stat-card-premium:hover .stat-glow {
  opacity: 1;
}

/* Un card poate fi setat ca activ în mod implicit pentru asimetrie */
.stat-card-premium.active-accent {
  border-color: rgba(217, 138, 68, 0.15);
}

@keyframes ledPulse {
  0% { opacity: 0.4; }
  100% { opacity: 1; }
}

/* ============ MEDIA QUERIES (FLUIDITATE DE EXCEPȚIE) ============ */
@media (max-width: 1024px) {
  .commitment-grid {
    gap: 50px;
  }
}

@media (max-width: 850px) {
  .commitment-section-premium {
    padding: 80px 0;
  }
  .commitment-grid {
    grid-template-columns: 1fr; /* Trece pe o singură coloană perfect ordonată pe tabletă/mobil */
    gap: 45px;
  }
  .commitment-content {
    align-items: flex-start;
  }
}

@media (max-width: 480px) {
  .commitment-stats-wrapper {
    grid-template-columns: 1fr; /* Pe telefoanele înguste, cardurile de statistici se aliniază vertical */
    gap: 16px;
  }
  .stat-card-premium {
    padding: 24px;
  }
}
/* ============ PREMIUM SERVICES SECTION ============ */
.services-section-custom {
  padding: 120px 0;
  background-color: var(--bg, #0E1216);
  position: relative;
}

/* Antetul secțiunii */
.services-header {
  text-align: center;
  max-width: 600px;
  margin: 0 auto 64px auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.services-header h2 {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(30px, 4vw, 44px);
  color: var(--text, #EDEAE3);
  margin: 0;
  line-height: 1.15;
}

.services-header h2 .accent {
  color: var(--copper-bright, #F2A93C);
}

.services-subtitle {
  font-size: 16px;
  color: var(--text-muted, #9CA3AF);
  margin: 0;
}

/* Grid-ul flexibil (Auto-calculează spațiul disponibil) */
.services-custom-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
}

/* Cardurile de servicii */
.service-card-custom {
  position: relative;
  background: var(--surface-1, #13171C);
  border: 1px solid var(--line-strong, rgba(237, 234, 227, 0.05));
  border-radius: 12px;
  padding: 40px 30px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), 
              border-color 0.4s ease, 
              box-shadow 0.4s ease;
  overflow: hidden;
}

/* Indicator mic tip "LED de tensiune" */
.card-status-dot {
  position: absolute;
  top: 24px;
  right: 24px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: rgba(237, 234, 227, 0.15);
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

/* Wrapper-ul pentru iconiță */
.icon-wrapper {
  color: var(--text-muted, #9CA3AF);
  transition: color 0.3s ease, transform 0.3s ease;
}

.service-icon {
  width: 32px;
  height: 32px;
  stroke-width: 1.5; /* Linii mai subțiri și elegante */
}

.service-card-custom h3 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 19px;
  font-weight: 600;
  color: var(--text, #EDEAE3);
  margin: 0;
  letter-spacing: -0.01em;
}

.service-card-custom p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-muted, rgba(237, 234, 227, 0.65));
  margin: 0;
}

/* HOVER pe card */
.service-card-custom:hover {
  transform: translateY(-5px);
  border-color: rgba(217, 138, 68, 0.25);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
}

.service-card-custom:hover .icon-wrapper {
  color: var(--copper-bright, #F2A93C);
  transform: scale(1.05);
}

.service-card-custom:hover .card-status-dot {
  background-color: var(--copper-bright, #F2A93C);
  box-shadow: 0 0 8px var(--copper-bright, #F2A93C);
}

/* ============ PREMIER CTA BUTTON ============ */
.services-cta-wrapper {
  margin-top: 60px;
  display: flex;
  justify-content: center;
}

.btn-primary-premium {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background-color: transparent;
  color: var(--text, #EDEAE3);
  border: 1px solid rgba(237, 234, 227, 0.15);
  padding: 16px 36px;
  border-radius: 100px;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  transition: background-color 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}

.btn-arrow {
  transition: transform 0.3s ease;
}

.btn-primary-premium:hover {
  border-color: var(--copper-bright, #F2A93C);
  background-color: rgba(217, 138, 68, 0.05);
  transform: translateY(-2px);
}

.btn-primary-premium:hover .btn-arrow {
  transform: translateX(4px);
  color: var(--copper-bright, #F2A93C);
}

/* ============ MEDIA QUERIES (FLUIDITATE PERFECTĂ) ============ */
@media (max-width: 768px) {
  .services-section-custom {
    padding: 80px 0;
  }
  .services-header {
    margin-bottom: 48px;
  }
  .services-custom-grid {
    gap: 16px;
  }
  .service-card-custom {
    padding: 30px 24px;
  }
}
/* ============ PREMIUM FAQ SECTION ============ */
.faq-section-premium {
  padding: 120px 0;
  background-color: var(--bg, #0E1216);
}

.faq-header {
  text-align: center;
  margin-bottom: 60px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.faq-header h2 {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(30px, 4vw, 44px);
  color: var(--text, #EDEAE3);
  margin: 0;
}

.faq-header h2 .accent {
  color: var(--copper-bright, #F2A93C);
}

.faq-container {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Stilul panoului FAQ */
.faq-item {
  background: var(--surface-1, #13171C);
  border: 1px solid var(--line-strong, rgba(237, 234, 227, 0.05));
  border-radius: 12px;
  overflow: hidden;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.faq-trigger {
  width: 100%;
  background: transparent;
  border: none;
  padding: 24px 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  text-align: left;
  gap: 20px;
}

.faq-title-group {
  display: flex;
  align-items: center;
  gap: 20px;
}

.faq-number {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 13px;
  color: var(--copper-bright, #F2A93C);
  opacity: 0.8;
  background: rgba(217, 138, 68, 0.08);
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid rgba(217, 138, 68, 0.15);
}

.faq-trigger h3 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 17px;
  font-weight: 600;
  color: var(--text, #EDEAE3);
  margin: 0;
  line-height: 1.4;
  transition: color 0.3s ease;
}

.faq-icon {
  color: var(--text-muted, #9CA3AF);
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), color 0.3s ease;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

/* Animație modernă pentru acordon (folosind CSS Grid) */
.faq-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s cubic-bezier(0.25, 1, 0.5, 1);
}

.faq-item.active .faq-content {
  /* Lăsăm JS-ul să injecteze maxHeight-ul corect în pixeli */
}

.faq-content-inner {
  overflow: hidden;
}

.faq-content p {
  padding: 0 30px 24px 73px; /* Aliniat perfect după număr */
  font-size: 15px;
  line-height: 1.6;
  color: var(--text-muted, rgba(237, 234, 227, 0.7));
  margin: 0;
}

/* Stări de interacțiune / Hover & Active */
.faq-item:hover {
  border-color: rgba(217, 138, 68, 0.2);
}

.faq-item:hover .faq-trigger h3 {
  color: var(--copper-bright, #F2A93C);
}

/* Când clasa active este aplicată (prin JS) */
.faq-item.active {
  border-color: rgba(217, 138, 68, 0.25);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}

.faq-item.active .faq-icon {
  transform: rotate(180deg);
  color: var(--copper-bright, #F2A93C);
}

/* ============ INTEGRATED GOOGLE MAP ============ */
.map-section-integrated {
  padding: 60px 0 120px 0;
  background-color: var(--bg, #0E1216);
}

.map-card-frame {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--line-strong, rgba(237, 234, 227, 0.06));
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
  background: var(--surface-1, #13171C);
}

/* Mic badge cu status "Live" suprapus pe hartă */
.map-status-overlay {
  position: absolute;
  top: 20px;
  left: 20px;
  background: rgba(14, 18, 22, 0.85);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(237, 234, 227, 0.1);
  padding: 8px 16px;
  border-radius: 100px;
  display: flex;
  align-items: center;
  gap: 10px;
  z-index: 10;
  pointer-events: none;
}

.pulse-dot {
  width: 6px;
  height: 6px;
  background-color: var(--copper-bright, #F2A93C);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--copper-bright, #F2A93C);
  animation: mapDotPulse 2s infinite alternate;
}

.status-text {
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--text, #EDEAE3);
}

.map-iframe-holder {
  position: relative;
  width: 100%;
  height: 450px;
}

.map-iframe-holder iframe {
  width: 100%;
  height: 100%;
  border: none;
  filter: grayscale(0.9) invert(0.92) contrast(1.1) brightness(0.95); /* Menține schema dark a site-ului */
  opacity: 0.85;
  transition: filter 0.5s ease, opacity 0.5s ease;
}

/* Harta își revine fin la culorile originale la hover pentru o utilizare ușoară */
.map-card-frame:hover iframe {
  filter: grayscale(0) invert(0) contrast(1) brightness(1);
  opacity: 1;
}

@keyframes mapDotPulse {
  0% { opacity: 0.4; transform: scale(0.9); }
  100% { opacity: 1; transform: scale(1.1); }
}

/* ============ MEDIA QUERIES ============ */
@media (max-width: 768px) {
  .faq-section-premium {
    padding: 80px 0;
  }
  .faq-trigger {
    padding: 20px;
  }
  .faq-content p {
    padding: 0 20px 20px 53px; /* Ajustare spațiu interior */
    font-size: 14px;
  }
  .map-iframe-holder {
    height: 350px;
  }
}
/* ============ HERO UPDATES & STATS ============ */
.hero {
  position: relative;
  overflow: hidden;
  padding: 160px 0 100px 0;
  background-color: #0E1216;
}

/* Structura grid a statisticilor */
.hero-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  margin-top: 50px;
  border-top: 1px solid rgba(237, 234, 227, 0.08);
  padding-top: 30px;
}

.stat {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.stat b {
  font-family: 'Space Grotesk', 'IBM Plex Mono', sans-serif;
  font-size: clamp(32px, 4vw, 42px);
  font-weight: 700;
  color: #EDEAE3;
  line-height: 1;
  letter-spacing: -0.02em;
  /* Font variant numeric previne tremuratul cifrelor în timpul animației */
  font-variant-numeric: tabular-nums; 
  transition: color 0.3s ease;
}

/* Evidențiere subtilă pe numere */
.hero-stats:hover .stat b {
  color: var(--copper-bright, #F2A93C);
}

.stat span {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: var(--text-muted, #9CA3AF);
  line-height: 1.4;
}

/* ============ MEDIA QUERIES PENTRU TELEFON (FLUIDITATE PERFECTĂ) ============ */
@media (max-width: 1024px) {
  .hero-stats {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
}

@media (max-width: 480px) {
  .hero {
    padding: 120px 0 60px 0;
  }
  .hero-stats {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px 16px;
    margin-top: 40px;
    padding-top: 24px;
  }
  .stat b {
    font-size: 28px; /* O idee mai mic pe ecranele foarte mici ca să nu se suprapună textul */
  }
  .stat span {
    font-size: 10px;
  }
}